Question

我使用Angular UI路由器作为我的路由器。我有一个$ state定义如下：

$stateProvider.state('mypage', {
     url:'/', 
     views: { 
         'content': { 
              templateUrl: 'folder/mypage.template.html', 
              controller: 'MyPageController' 
          }
      }
})

我可以转到MyPageController并执行以下操作：

$rootScope.test = "hello!";

然后转到文件夹/ mypage.template.html并输入以下内容：

<div id="example">
    {{test}}
</div>

您好！将显示在呈现的网页中。但是，如果我在MyPageController中执行以下操作：

$scope.test = "hello!";

模板中不会显示任何内容。这对我来说非常混乱，因为我知道MyPageController可供状态使用（因为我可以向$ rootScope添加内容并显示它），但$ scope不可用。有没有人知道可能会发生什么？谢谢:)）

EDIT1： MyPageController是模块的一部分，让我们说myModule，它被导入到顶级模块中。例如，它看起来像这样：

angular.module('topLevelModule', [
    'myModule'
]).config( ... $stateProvider stuff ... ).run( ... setup stuff ... )

angular.module('myModule')
    .controller('MyPageController', ['$scope', '$rootScope', function($scope, $rootScope) {
        $scope.test = "hello!";
    }]);

EDIT2（问题解决）：

我遵循了一个教程，该教程在UI-Router中使用了以下具有多个状态的模式：

$stateProvider
    .state('mainpage', {
        url: '/',
        views: {
            'content': {
                templateUrl: 'folder/mainpage.template.html',
                controller: 'MainPageController' <-- POINT OF INTEREST 1
            }
        }
    })
    .state('mypage', {
        url: 'my-page',
        controller: 'MyPageController', <-- POINT OF INTEREST 2
        views: {
            'content@': {
                templateUrl: 'folder/mypage.template.html',
                <-- POINT OF INTEREST 3
            }
        }
    })
}])

然而，问题在于这种格式化。对于任何使用UI路由器的人来说，这只是一个问题，他们碰巧遵循了我所做的相同教程（我无法找到链接），需要将POINT OF INTEREST 2移动到POINT OF INTEREST 3控制器在状态改变时正确分配 - 语法错误。事情发生的原因（由于我的调试方法）导致上述任何不一致的原因更复杂，但我不想在这里包含它们。谢谢大家的时间。：）

Answer 1

var test = angular.module('test', []);

test.run(function() {    
});

test.config(function() {
// your state for binding html with controller
});

test.controller('MyPageController ', function($scope) {
    $scope.test = "hello!";
});

然后在HTML中

<div id="example">
    {{test}}
</div>

为什么我能够在Angular控制器中为$ rootScope分配变量并在模板中访问它，但是如果我将变量赋值给$ scope呢？

1 个答案: