I seem to be losing scope on my angular controller when I am trying to abstract my Angularjs modules.
当我试图抽象我的Angularjs模块时,我似乎正在失去角度控制器的范围。
It works fine if i use my app module, but as soon as I change the home.js module to app.layout, $scope no longer works.
如果我使用我的应用程序模块,它工作正常,但一旦我将home.js模块更改为app.layout,$ scope不再有效。
Can anybody spot an issue here?
有人能在这里发现问题吗?
_Layout.html (left out includes and head)
_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() brings up Index.html
@RenderBody()调出了Index.html
<!-- this is where content will be injected -->
<div ng-view></div>
Home.html
Home.html中
<div>
<h1>Home Page</h1>
<p>{{ message }}</p>
</div>
My app.js
我的app.js.
angular.
.module('app', [
'app.core',
'app.layout',
]);
})();
})();
layout.module.js
layout.module.js
(function () {
'use strict';
angular.module('app.layout', [
'ngAnimate',
'ngMaterial',
'ngAria'
]);
})();
})();
core.module.js
core.module.js
(function () {
'use strict';
angular.module('app.core', [
'ngRoute'
]);
})();
})();
and route.js:
和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
And Finally the culprit... Home.js
最后,罪魁祸首...... 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!';
}
})();
})();
Now, When i have
现在,当我有
.module('app);
.controller('home', home);
on home.js, the $scope.message displays
在home.js上,显示$ scope.message
'Everyone come and see how good I look!'
but if i have
但如果我有
.module('app.layout')
.controller('home', home);
it displays
它显示
{{message}}
I know I'm losing scope somehow here, but I cant figure out how to fix it! Do I need to declare the controller again outside of the Router?
我知道我在某种程度上失去了范围,但我无法弄清楚如何解决它!我是否需要在路由器外再次声明控制器?
2 个解决方案
#1
0
I think Angular not able to get your home
controller. You should inject app.layout
in app.core
module.
我认为Angular无法获得你的家庭控制器。你应该在app.core模块中注入app.layout。
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();
#2
0
The solution was rather frustrating. Using Visual Studio's Bundle config, It was adding the home.js file in before it compiled the module files. In doing so, when it tried to build and register the controller, It couldn't find the module. solution was to build all modules first then build controllers by specifying build order in the bundle config.
解决方案相当令人沮丧。使用Visual Studio的Bundle配置,它在编译模块文件之前添加了home.js文件。这样做时,当它试图构建并注册控制器时,它找不到模块。解决方案是首先构建所有模块,然后通过在bundle config中指定构建顺序来构建控制器。
#1
0
I think Angular not able to get your home
controller. You should inject app.layout
in app.core
module.
我认为Angular无法获得你的家庭控制器。你应该在app.core模块中注入app.layout。
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();
#2
0
The solution was rather frustrating. Using Visual Studio's Bundle config, It was adding the home.js file in before it compiled the module files. In doing so, when it tried to build and register the controller, It couldn't find the module. solution was to build all modules first then build controllers by specifying build order in the bundle config.
解决方案相当令人沮丧。使用Visual Studio的Bundle配置,它在编译模块文件之前添加了home.js文件。这样做时,当它试图构建并注册控制器时,它找不到模块。解决方案是首先构建所有模块,然后通过在bundle config中指定构建顺序来构建控制器。