如果在$ stateProvider中指定,Angular ui-router在加载时运行控制器两次

时间:2017-03-24 21:36:51

标签: javascript angularjs angular-ui-router

我看到我的控制器中的代码正在运行两次,因此在chrome dev工具的console.log窗口输出中显示

questions.html

<div ng-controller="questionController as vm"> </div>

questionController.js

var questionController = function($location, questionService, $env) {
    var vm = this;
    console.log('in the controller')  // this runs twice 
}

app.js

app.config([
    '$stateProvider',
    '$urlRouterProvider',
    '$locationProvider',
    function ($stateProvider, $urlRouterProvider, $locationProvider) {

        var viewBase = '/apps/src/views/';

        $urlRouterProvider.otherwise("/");

        $locationProvider.hashPrefix(''); // get rid of ! was getting #! 

        $stateProvider
            .state('questions',
            {
                url: "/questions",
                templateUrl: viewBase + "questions.html"//,
                //controller: "questionController"
                //views: {
                //
                //}
            });


    }]
);

请注意,我在路线中注释了controller: "questionController",否则它会跑两次。

我知道我去年使用过ui-router而且我总是使用控制器:没有任何问题。

也许某些新版本组合会导致错误?

基于我正在尝试的答案,但不是数据不显示

我正在使用ui-grid

 <!--<div ng-controller="questionController as vm">-->

       <div ui-grid="{ data: vm }" class="grid"></div>

  <!--</div>-->

注意我用ng-controller

注释掉了div
  var vm = this
  var promise = questionService.getAllQuestions();

    promise.then(function(response) {
        vm.myData = response;
        console.log('questionCtrl promise data', vm.myData);
    });

console.log可以解析数据

固定

似乎我必须这样做

路线

     controller: "questionController",
     controllerAs : "vm"

OR

      controller: "questionController"

然后

 <div ui-grid="{ data: vm.myData }" class="grid"></div>

1 个答案:

答案 0 :(得分:3)

这是因为您通过

将{@ 1}}中的控制器以及模板本身包括在内
$stateProvider

您可以从HTML中删除<div ng-controller="questionController as vm"></div>