UI.Router混乱

Question

请查看下面的代码段。控制台输出是：

• 在MainController中

问题：

1. 为什么我看不到＆＃34;在主要决心＆＃34;在控制台输出？

2. 此外，我在 index.html 中有<ui-view></ui-view>。部分 dashoard.html 会在那里加载。为什么？我从未说过要去那个州。

   angular.module('main',['ui.router'])
       .config(['$stateProvider',function($stateProvider) {
           $stateProvider
               .state('main', {
                       url: '/',
                       templateUrl: 'index.html',  
                       controller: 'MainController',
                       resolve: {
                           ResA:  function() {
                               console.log('In Main Resolve');
                           }
                       }
               })
               .state('dashboard', {
                       url:'/dashboard',
                       templateUrl: "dashboard.html",
                       controller: 'dashCtrl'
               });
   
       }])
       .controller('MainController',['$scope',function($scope) {
           console.log('In MainController');
           $scope.A = "John";
           $scope.B = "Doe";
   
       }])
       .controller('dashCtrl',function($scope) {
           $scope.Name = "Hello World"
       });
   

Answer 1

I am really not sure what is not working for you - because I used your code 1 : 1 in this working plunker - and it is working as expected.

The only change is, that instead of index.html, I used tpl.html - because index.html is simply the Root - Single Page.

And exactly that could be causing all the issues. Other words, index.html seem to be targeting the root...

.state('main', {
  url: '/',
  //templateUrl: 'index.html',
  templateUrl: 'tpl.html',
  controller: 'MainController',
  resolve: {
    ResA: function() {
      console.log('In Main Resolve');
    }
  }
})

Going to this state, console writes:

In Main Resolve
In MainController

Check it here