AngularJS未能进入控制器
问题描述:
我的控制器有问题 - 应用程序没有进入它的内部,也没有显示图像,但最糟糕的是没有来自控制器的日志(console.log(“AppCtrl”))。我不知道哪里出了错。
app.js
AngularJS未能进入控制器
(function() {
angular.module('AppModule', ['ui.router'])
.config(['$stateProvider', '$urlRouterProvider',
function($stateProvider, $urlRouterProvider) {
$urlRouterProvider.otherwise('posts-view');
$stateProvider
.state('posts-view', {
url:'/style/views',
templateUrl: '/posts-view.html',
controller: 'AppCtrl'
})
.state('single-post-view', {
templateUrl: '/style/views/single-post-view.html'
});
/*.otherwise({
redirectTo: 'style/views/posts-view'
})*/
}
]);
})();
controller.js
angular.module('AppModule')
.controller('AppCtrl', AppCtrl);
AppCtrl.$inject = ['AppData'];
function AppCtrl(AppData) {
console.log("AppCtrl");
var vm = this; //View model;
//vars
vm.posts = [];
//definitions
vm.getFoto = getFoto;
//inits
vm.getFoto();
function getFoto() {
AppData.fetchNewPosts()
.then(function Success(data) {
vm.posts = data.data.data;
}, function Error(error) {
});
}
}
service.js
angular.module('AppModule')
.factory('AppData', AppData);
AppData.$inject = ['$http'];
function AppData($http) {
var exports = {
fetchNewPosts: fetchNewPosts,
};
return exports;
function fetchNewPosts() {
//some not important code at the moment
}
}
帖子,view.html
<div class="posts">
<h2> Cosplay section sorted from the newest</h2>
<div class="row" ng-repeat="post in AppCtrl.posts">
<div class="col-md-3 post-block" ng-mouseenter="option=true" ng-mouseleave="option=false">
<img ng-show="{{post.images[0]}}" src="{{post.images[0].link}}" alt="image" >
<img ng-hide="{{post.images[0]}}" src="{{post.link}}" alt="image">
<span class="title-box" ng-show="option">{{post.title}}</span>
</div>
</div>
</div>
应用程序进入岗位,view.html内,因为它表明H2标签内的文本,但仅此而已。请帮助我,我很抱歉我的英语。
答
好吧,我明白了。我在index.html中加入了“post-view.html”和ng-include,这就是为什么我可以在post-view.html中看到标签的原因。当我为ma文件设置适当的路径时,我得到了和以前一样的结果。
但我仍然无法进入控制器变量或函数。当我试图在控制器使用变量集:
vm.foo = "foo";
内部使用后view.html
<span> {{AppCtrl.foo}}</span>
不幸的是什么也不显示。问题在哪里?请帮帮我。
PS。当我使用$ scope的时候它是可以的,但我不想那样做。我想用正确的方式使用控制器或别名的名称来执行此操作。