Question

当我试图抽象我的Angularjs模块时，我似乎正在失去角度控制器的范围。

如果我使用我的应用程序模块，它可以正常工作，但只要我将home.js模块更改为app.layout，$ scope就不再有效了。

有人能在这里发现问题吗？

_Layout.html（左外包括和头）

<body class="docs-body" ng-app="app">
<div layout="column" ng-cloak>
    <section layout="row" flex>
        <div ng-include="'App/layout/sidenav.html'"></div>
        <md-content class="_md layout-column flex" layout="column" flex="">
            <div ng-include="'App/layout/toolbar.html'"></div>
            <div class="container body-content">
                @RenderBody()
            </div>
        </md-content>
    </section>
</div>
</body>

@RenderBody（）调出Index.html

<!-- this is where content will be injected -->
<div ng-view></div>

Home.html中

<div>
<h1>Home Page</h1>
<p>{{ message }}</p>
</div>

我的app.js

angular.
.module('app', [
        'app.core',
        'app.layout',
    ]);

}）（）;

layout.module.js

(function () {
'use strict';

angular.module('app.layout', [
    'ngAnimate',
    'ngMaterial',
    'ngAria'
]);

}）（）;

core.module.js

(function () {
'use strict';

angular.module('app.core', [
    'ngRoute'
]);

}）（）;

和route.js：

angular.module('app.core')
    .config(function ($routeProvider, $locationProvider) {
        $routeProvider

        // route for the home page
        .when('/', {
            templateUrl: 'App/layout/home.html',
            controller: 'home'
        });// End routeprovider
    })// end config

最后罪魁祸首...... Home.js

(function () {
'use strict';

console.log('registering controller home before Angular');

angular
    .module('app.layout')
    .controller('home', home);

home.$inject = ['$scope']; 

function home($scope) {
    console.log('registering controller home');
    // create a message to display in our view
    $scope.message = 'Everyone come and see how good I look!';
}

}）（）;

现在，当我有

.module('app);
.controller('home', home);

在home.js上，$ scope.message显示

'Everyone come and see how good I look!'

但如果我有

.module('app.layout')
.controller('home', home);

显示

{{message}}

我知道我在某种程度上失去了范围，但我无法弄清楚如何修复它！我是否需要在路由器外再次声明控制器？

Answer 1

我认为Angular无法获得您的home控制器。您应该在app.layout模块中注入app.core。

  angular.module('app.core', ['app.layout'])
    .config(function ($routeProvider, $locationProvider) {
        $routeProvider

        // route for the home page
        .when('/', {
            templateUrl: 'App/layout/home.html',
            controller: 'home'
        });// End routeprovider
    })// end config


angular.
.module('app.layout',[]).controller();

Answer 2

解决方案令人沮丧。使用Visual Studio的Bundle配置，它在编译模块文件之前添加了home.js文件。在这样做时，当它试图构建并注册控制器时，它无法找到模块。解决方案是首先构建所有模块，然后通过在bundle config中指定构建顺序来构建控制器。

使用ng-view

2 个答案: