AngularJs的controller多次执行问题

日期:2017-09-29       浏览:738

一 路由配置

在路由配置信息里:
myApp.config(['$routeProvider',
    function($routeProvider) {
    // 路由配置
    $routeProvider
    .when('/login', {
        controller : 'login' ,
        templateUrl : './model/login.html'
    })
    .otherwise({
        redirectTo : '/login'
    });
}]);

二 控制器

以上是一个登录页面的配置,在配置里有controller和templateUrl的相关信息,让我们来看看templateUrl请求的login.html页面信息:
<div ng-controller="login" class="box">
    <h1>{{title}}</h1>
    <form action="" method="POST">
        <input id="username" type="text" ng-model="uname"/><br/>
        <input id="password" type="password" /><br/>
        <input type="button" value="submit" ng-click="submit()"/>
        <a href="#/register">register</a>
    </form>
</div>
在login.html页面我们看到有ng-controller=”login”的配置信息。并且路由里配置的controller在templateUrl配置前,这时就存在一个问题,即路由里配置的controller会执行一遍controller(login),然后在templateUrl加载模板信息的时候,模板信息里也配置了ng-controller=”login”,加载到这里也会执行一遍login的controller,这时就会导致login的controller会被执行两遍。所以为了不让相同的controller多次执行,并且易于管理相关模块,我们在路由里只配置加载模板的消息,去掉controller的配置,该模板的controller只在模板内通过ng-controller=”login”进行配置。
扫码关注有惊喜

(转载本站文章请注明作者和出处 qbian)

暂无评论

Copyright 2016 qbian. All Rights Reserved.

文章目录