标签: angularjs-controller
Angularjs Uncaught Error:[$ injector:modulerr]迁移到V1.3时
我正在学习Angular.js,我无法弄清楚这个简单的代码有什么问题.它看起来很好,但给我跟随错误.
**Error**: Uncaught Error: [$injector:modulerr] http://errors.angularjs.org/1.3.14/$injector/modulerr?p0=app&p1=Error%3A%20…gleapis.com%2Fajax%2Flibs%2Fangularjs%2F1.3.14%2Fangular.min.js%3A17%3A381)
在添加之前(我只是保留它)它给了我以下错误.这是为什么？ng-app="app"ng-app
Error: [ng:areq] http://errors.angularjs.org/1.3.14/ng/areq?p0=Ctrl&p1=not%20a%20function%2C%20got%20undefined
at Error (native)
at https://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.min.js:6:417
at Sb (https://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.min.js:19:510)
at tb (https://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.min.js:20:78)
at $get (https://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.min.js:75:331)
at https://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.min.js:57:65
at s (https://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.min.js:7:408)
at A (https://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.min.js:56:443)
at g (https://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.min.js:51:299)
at g (https://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.min.js:51:316)
<!doctype html>
<html ng-app="app">
<head>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.min.js"></script>
</head>
<body>
<div ng-controller="Ctrl">
<input ng-model="name">
<h1>{{name}}</h1>
<h2>{{age}}</h2>
</div>
<script>
var Ctrl = function($scope)
{
$scope.age = 24;
};
</script>
</body>
</html>
javascript angularjs angularjs-service angularjs-scope angularjs-controller
推荐指数
解决办法
查看次数
从angularjs中的服务调用控制器功能
我正在使用socket.io在我的应用程序中启用聊天,我正在使用服务SocketService来执行所有套接字的东西.当消息出现时,我想从服务触发控制器的功能,以SocketService在UI中进行一些更改.所以我想知道如何从服务中访问控制器的功能.示例代码:
.service('SocketService', function ($http,$rootScope,$q) {
this.connect = function(){
var socket = io();
socket.on('connect',function(){
// Call a function named 'someFunction' in controller 'ChatController'
});
}
});
这是服务的示例代码.
现在是控制器的代码
.controller('ChatController',function('SocketService',$scope){
$scope.someFunction = function(){
// Some Code Here
}
});
events angularjs angularjs-service angularjs-controller angular-broadcast
推荐指数
解决办法
查看次数
在$ stateProvider.state中分配多个控制器
对于高级角度用户来说,这可能是一个简单的问题,但我没有在某个地方找到这个问题.
所以我正在重构我的代码,当我意识到,我在视图中有两个控制器,这不是问题,当控制器'ACtrl'被$ stateProvider绑定并且控制器'BCtrl'在视图中通过ng-controller绑定.但是当我尝试在$ stateProvider中分配它们时,如下所示:
$stateProvider.state('a.view', {
url: "/anurl",
views: {
'menuContent': {
templateUrl: "anUrlToMyTemplates",
controller: 'ACtrl', 'BCtrl'
}
}
});
或者那个:
$stateProvider.state('a.view', {
url: "/anurl",
views: {
'menuContent': {
templateUrl: "anUrlToMyTemplates",
controller: 'ACtrl',
controller: 'BCtrl'
}
}
});
它不会起作用.
我知道这将是一个解决方案,使控制器的内容达到一个,但控制器'ACtrl'也在其他地方使用,所以我不得不在其他地方重复自己.我该怎么解决这个问题......
angularjs angular-routing angularjs-routing angularjs-controller
推荐指数
解决办法
查看次数
AngularJS:$ scope.array.push()不会更新视图,即使使用$ apply也是如此
我正在尝试学习AngularJS并且有一些我不理解的东西,这似乎是所有的互联网都通过使用解决了$scope.$apply,但我已经使用它,它什么也没做.
基本上,我使用Twitter API来检索时间轴,当我们从底部滚动时,它会加载更多的推文.这部分工作,我正在使用工厂来做,但我可以在控制台中显示对象接收,我这里没有问题.
我有这样的观点,以显示数据:
<div class='timeline' ng-controller='TimelineCtrl' is-scrolled='loadData()'>
<div class='tweet' ng-repeat='p in posts'>
<img class='portrait' src='{{p.user.profile_image_url}}' />
<p>{{p.text}}</p>
<p class='date'>{{p.created_at}}</p>
</div>
</div>
我的控制器看起来像这样:
$scope.posts = [];
// Load the original tweets list
TwitterAPI.timeline($scope.count, function(data) {
$scope.$apply(function() {
$scope.maxId = data[data.length-1].id;
$scope.sinceId = data[0].id;
$scope.posts.push(data);
});
});
数据是合法的.
我根本不懂的东西,让我觉得它很容易解决,我只是看不到它,如果我使用'= data'代替'push(data)',那么视图就是更新.即使我加载了更多的推文,如果我使用'=',视图也会更新(内容被替换当然不是我想要的).
注意:maxId,sinceId和count之前已初始化,我没有把它放在那里,因为我觉得不重要.
angularjs angularjs-scope angularjs-ng-repeat angularjs-controller
推荐指数
解决办法
查看次数
Angular ui-router将值解析为字符串
使用ui-router,我在状态函数中添加所有解析逻辑,如下所示;
//my-ctrl.js
var MyCtrl = function($scope, customers) {
$scope.customers = customers;
}
//routing.js
$stateProvider.state('customers.show', {
url: '/customers/:id',
template: template,
controller: 'MyCtrl',
resolve: { // <-- I feel this must define as like controller
customers: function(Customer, $stateParams) {
return Customer.get($stateParams.id);
}
}
});
但IMO,resolve对象必须属于控制器,如果在控制器文件中定义它,则易于读取和维护.
//my-ctrl.js
var MyCtrl = function($scope, customers) {
$scope.customers = customers;
}
MyCtrl.resolve = {
customers: function(Customer, $stateParams) {
return Customer.get($stateParams.id);
};
};
//routing.js
$stateProvider.state('customers.show', {
url: '/customers/:id',
template: template,
controller: 'MyCtrl',
resolve: 'MyCtrl.resolve' //<--- Error: …javascript angularjs angularjs-routing angularjs-controller angular-ui-router
推荐指数
解决办法
查看次数
Angular ui.router,从子控制器调用父控制器功能？
我正在使用带有ui.router的Angular并设置了一个嵌套视图.父视图有一个div,其可见性我可以切换父控制器上的一个函数.我想从嵌套视图的子控制器中调用此函数.我该怎么做？
推荐指数
解决办法
查看次数
如何在angularJS中将自动完成下拉列表作为网格？
在这里,我创建了自动完成的示例,它工作正常,我需要对此进行一些修改.目前它的工作方式是这样的
但我真正需要的是我需要将下拉列表显示为网格视图.有些像这样
任何人都可以帮忙吗？谢谢
var app = angular.module('app', ['ui.bootstrap']);
app.controller('TypeaheadCtrl', function ($scope, $http, limitToFilter, filterFilter) {
$scope.sample_data = [{
"name": "Nelson",
"designation":"Senior Developer",
"company": "acme",
"companydisplay": "abc"
},
{
"name": "suresh",
"designation":"Developer",
"company": "acme",
"companydisplay": "def"
},
{
"name": "Naresh",
"designation":"Developer",
"company": "acme",
"companydisplay": "xyz"
}];
$scope.filtered_sample_data = function (search) {
var filtered = filterFilter($scope.sample_data, search);
var results = _(filtered)
.groupBy('company')
.map(function (g) {
g[0].initial = true; // the first item in each group
return g;
})
.flatten()
.value();
return results; …javascript angularjs angularjs-directive angularjs-scope angularjs-controller
推荐指数
解决办法
查看次数
AngularJS - 如何避免使用$ timeout来等待创建元素？
这是一个想法:
所以我试图使用外部库函数在我的ng-repeat所连接的控制器中的DOM中创建一些操作.
最新的jsFiddle工作,但......
http://jsfiddle.net/GeorgiAngelov/KRbdL/150/
所以基本上我得到它与@ BrandonTilley的帮助,但我试图避免使用$ timeout,因为我认为这不是一个可行的解决方案,而是一个黑客.
在@BrandonTilley的帮助下,新的小提琴
添加了onload监听器,我也试图通过getElementById获取新元素或其父元素,但它返回的只是NULL.
http://jsfiddle.net/GeorgiAngelov/KRbdL/143/
问题如下:我在我的控制器中调用了外部函数,它将元素添加到ng-repeat数组中,这在术语中将新元素添加到DOM中.但是,当我在控制器内部时,该元素尚不存在,即使我已将其添加到数组中.
一旦元素实际上被附加到DOM,而不是实际添加到控制ng-repeat的数组中,我如何绑定要调用的外部函数？
问题是我有模板1调用模板2,然后模板2调用template3然后template3调用模板2,我想在template3完成渲染template2后将template3中的元素连接到template2.
我创建了一个链接到template3的指令,我使用了$ last属性,但它仍然无法工作,因为template3加载但我不知道template2何时完成加载.此外,element.ready()甚至没有启动.我也尝试使用$ timeout和删除element.ready进行黑客攻击,但它仍然给了我一个错误,即子元素还没有存在.我不想使用$ timeout,所以我正在为我的问题寻找更实用的解决方案.
另外,当我调用函数来创建一个新的firstlevel元素时,我尝试调用jsPlumb库,但是它给了parentNode undefined.我在addChild函数中对它进行了评论.
在ng-repeat ng-include = template2上的模板3中使用的指令
app.directive('vectorDrawDirective', function($timeout) {
return function($scope, element, attrs) {
//angular.element(element).css('color','blue');
if ($scope.$last === true) {
element.ready(function() {
jsPlumb.connect({
source: $scope.firstlevel.parent_id,
target: $scope.firstlevel.id,
});
jsPlumb.repaintEverything();
})
}
}
});
这是我用来帮助您想象我想要实现的内容的图表(查看右上角的文字)
jsplumb angularjs angularjs-directive angularjs-service angularjs-controller
推荐指数
解决办法
查看次数
防止提交时违约: - Angularjs
如果填写表单时电子邮件为空,我想阻止http-post的默认操作为'/ signUp'.
控制器代码: -
$scope.signUp = function() {
if($scope.email = null);
preventdefault;
}
html(玉): -
form(name="input", action="/signUp", method="post")
input(type="submit", value="submit")
推荐指数
解决办法
查看次数
AngularJs:将ng-model绑定到单选按钮列表
我试图将单选按钮列表中的选定值绑定到 ng-model
我有:
<!DOCTYPE html>
<html ng-app="testApp">
<head>
<script src="./bower_components/angular/angular.min.js"></script>
<script src="test.js"></script>
</head>
<body ng-controller="testController">
<form>
<div ng-repeat="option in occurrenceOptions">
<input type="radio" name="occurrence" ng-value="option" ng-model="selectedOccurrence" /><label>{{ option }}</label>
</div>
</form>
<div>The selected value is : {{ selectedOccurrence }}</div>
<!-- This works -->
<input type="radio" ng-model="selected2" ng-value="'1'"> 1
<input type="radio" ng-model="selected2" ng-value="'2'"> 2
<input type="radio" ng-model="selected2" ng-value="'3'"> 3
<div>This selected value is : {{ selected2 }} </div>
</body>
</html>
对于我的控制器:
(function () {
var app = angular.module('testApp', []);
app.controller('testController', function($scope) { …推荐指数
解决办法
查看次数