我想知道什么是在控制器之间共享指令的好方法.我有两个指令在不同的控制器中使用不同的配置,我认为使用的第一个想法:
//html
<body data-ng-controller="MainCtrl">
<div class="container">
<div data-ui-view></div>
</div>
</body>
//js
.controller('MainCtrl', function ($scope,$upload) {
/*File upload config*/
$scope.onFileSelect = function($files) {
for (var i = 0; i < $files.length; i++) {
var file = $files[i];
$scope.upload = $upload.upload({
url: 'server/upload/url',
method: 'POST',
data: {myObj: $scope.myModelObj},
file: file,
}).progress(function(evt) {
console.log('percent: ' + parseInt(100.0 * evt.loaded / evt.total));
}).success(function(data, status, headers, config) {
console.log(data);
});
}
};
/* Datepicker config */
$scope.showWeeks = true;
$scope.minDate = new Date();
$scope.open = …Run Code Online (Sandbox Code Playgroud) angularjs angular-ui angularjs-directive angularjs-scope angular-ui-bootstrap
在我的控制器中,我有几个与$ scope相关的本地函数.随着这个数字的增加,他们现在似乎失控了.构造这些本地控制器功能的正确模式是什么?
例如,
function myController($scope) {
$scope.func1 = function() {
// do something with $scope
}
$scope.func2 = function() {
// do something with $scope
}
$scope.func3 = function() {
// do something with $scope
}
// ... controller code here ...
}
Run Code Online (Sandbox Code Playgroud)
有没有一种方法可以使这些本地func1,func2,func3更易于管理?
我试图通过指令更改控制器范围,但它不会更改.
当我通过指令更改模型时,goas将自动更改$scope.modulesin MyCtrl:
link: function (scope) {
scope.module.title += ' changed';
scope.module = {
title: 'Redeclared'
};
},
Run Code Online (Sandbox Code Playgroud)
这段代码完美无缺
scope.module.title += ' changed';
但这不是: scope.module = { title: 'Redeclared' };
在$ http.get请求之后,我们有一个对象,{title: 'Redeclared'}这就是为什么我这样做scope.module = { title: 'Redeclared' };
知道怎么做吗?谢谢
javascript angularjs angularjs-directive angularjs-scope angularjs-ng-repeat
我的页面上有输入框,其中包含用+分隔的字符串,例如:
this+is+my+string
Run Code Online (Sandbox Code Playgroud)
在页面加载时,我想用空白替换所有+.我试过了:
var str = $('#MyText1');
str = str.replace(/+/gi, ' ');
Run Code Online (Sandbox Code Playgroud)
但是我收到以下错误:
SyntaxError: invalid quantifier
Run Code Online (Sandbox Code Playgroud)
请注意我的应用程序使用的是Angular v.1.2.8
我刚开始学习AngularJS.
我创建了一个简单的应用程序来显示json文件中的内容.但是,分配给$ http内部范围的数据,返回undefined外部.
var app= angular.module('app',[]);
app.controller('apCtrl',['$scope','$http',function($scope,$http){
$http.get('/path/to/data.json').success(function(){
console.log(data); // returns data --working
$scope.data=data; // assiged
console.log($scope.data); // returns data --working
});
console.log($scope.data); // returns 'undefined' --not working
}]);
Run Code Online (Sandbox Code Playgroud)
请帮我理解这个问题.
谢谢!
所以我有这个来源:
<!DOCTYPE html>
<head>
<script src= "http://ajax.googleapis.com/ajax/libs/angularjs/1.2.7/angular.min.js"></script>
<script>
function commentController($scope) {
$scope.reportComments = [{ Name:"Frank", Comment:"Booka" }, { Name:"Frank2", Comment:"Booka2" }];
}
</script>
</head>
<body>
<div ng-app="" ng-controller="commentController">
<ul>
<li ng-repeat="c in reportComments">
{{ c.Name + ', ' + c.comment }}
</li>
</ul>
</div>
</body>
</html>
Run Code Online (Sandbox Code Playgroud)
而且效果很好.
但后来我将AngularJS的版本更改为1.3.0,我收到此错误:
错误:[ng:areq]参数'loadCommentsController'不是函数,未定义 http://errors.angularjs.org/1.3.7/ng/areq?p0=loadCommentsController&p1=not%20a%20function%2C%20got% 20undefined 在file:/// C:/Users/micah_000/Desktop/comment_testbed/js/angular.js:63:12在assertArg(文件:/// C:/ Users/micah_000/Desktop/comment_testbed/js/angular. js:1575:11)在assertArgFn(file:/// C:/Users/micah_000/Desktop/comment_testbed/js/angular.js:1585:3)的file:/// C:/ Users/micah_000/Desktop/comment_testbed/js/angular.js:8416:9 at file:/// C:/Users/micah_000/Desktop/comment_testbed/js/angular.js:7590:34 atEach(file:/// C:/ Users/micy_000/Desktop/comment_testbed/js/angular.js:331:20)在compositeLinkFn(file:/// C:/Users/micah_000/Desktop/comment_testbed/js/angular.js:7577:11)的compositeLinkFn(文件: ///C:/Users/micah_000/Desktop/comment_testbed/js/angular.js:7073:13)at publicLinkFn(file:/// C:/Users/micah_000/Desktop/comment_testbed/js/angular.js:6952 :30)在file:/// C:/ Users/micah_000/Desktop/commen t_testbed/JS/angular.js:1449:27
为什么?
我的控制器功能如何定义?
这与本教程密切相关.如果一个简单的教程在发行版之间中断,它会使框架看起来像volatile/mercurial /不可靠.
我想更多地了解$ scope.apply()的实时使用情况.我们可以在控制器中使用$ scope.apply()多少次?
例如,我有一些事件,如ng-click(),ng-change(),ng-blur()等.所有事件都在同一个控制器中.对于每个事件,我应该使用$ scope.apply()吗?如果是,我收到错误:
Error: [$rootScope:inprog] [http://errors.angularjs.org/1.2.15/$rootScope/inprog?p0=%24apply][1]
at Error (native)
Run Code Online (Sandbox Code Playgroud)
我在这个论坛中已经读到删除添加$ scope.apply()将解决问题.
angularjs $ scope.$ apply()给出了这个错误:错误:[$ rootScope:inprog]
我实现了从代码中删除多个$ scope.apply()的相同解决方案.错误消失了,但我想知道如何以及为什么?
任何人都可以解释.
提前致谢.
所以我使用以下代码在我的html页面上输出一些图像
<div ng-repeat="Object in Objects"><img src="{{Object.Image}}"></div>
Run Code Online (Sandbox Code Playgroud)
这很好用,可以循环我所有的图像对象,一切都很棒.但是我在控制器中设置了$ scope.Objects变量.因此,当我第一次启动我的网页时,我找不到404
http://192.168.1.180:8100/%7B%7BObject.Image%7D%7D
Run Code Online (Sandbox Code Playgroud)
再一次,一切正常,我的所有图像都显示出来,但是我收到了几个404错误(我在几个地方这样做)并且我试图摆脱它们.
我有一个听起来可能很愚蠢的场景,但是我被困住了,试图理解是什么导致了它不起作用。
我有一个现在有三个模块的角度应用程序
var app = angular.module('mainApp', ['ngRoute']); //parent module
var reviewModule = angular.module('reviewModule', ['mainApp']); //child 1
var searchmodule = angular.module('searchmodule', ['mainApp']); //child 2
Run Code Online (Sandbox Code Playgroud)
我已经在我的父模块(即mainApp)中设置了一些配置和默认字符串,我希望在其所有子模块中使用它。
另一方面,我的reviewModule和searchmodule(子模块)具有单独的控制器和服务,这些控制器和服务在不同的路线上使用。现在,问题来了,当我想将一个模块的服务用于另一个模块时,例如,如果我执行以下操作
var searchmodule = angular.module('searchmodule', ['mainApp', 'reviewModule']);
Run Code Online (Sandbox Code Playgroud)
在我的搜索模块控制器中使用reviewModule服务时,出现一个异常提示
Error: $injector:modulerr Module Error
Failed to instantiate module searchmodule
Run Code Online (Sandbox Code Playgroud)
两个子模块都具有相同的父模块,我想将一个子模块用于另一个子模块,并且不明白为什么会收到此异常。
更新:
我什至尝试使用以下行进行模块声明
var searchmodule = angular.module('searchmodule', ['reviewModule']);
Run Code Online (Sandbox Code Playgroud)
但这也会引起异常。
angularjs angularjs-scope angular-services angular-controller angular-module
<tab page="book"> </tab>
<tab page="dial"> </tab>
<tab page="groupe"> </tab>
<tab page="log"> </tab>
<tab page="star"> </tab>
Run Code Online (Sandbox Code Playgroud)
如你所见,我有一个名为tab的指令,这个选项卡有一个属性页面,
我需要根据页面属性的值 更改templateUrl
如果页面值是
page="abc"那么templateUrl应该是templateUrl: 'tab/abc.html',
这是我的指令代码
contactBook.directive('tab', function() {
let m = 'tab/default.html';
return {
restrict: 'E',
scope: {
page: '@',
},
templateUrl: m,
link: function(scope, element, attributes) {
m = "tab/" + scope.page + ".html";
},
};
});
Run Code Online (Sandbox Code Playgroud)
这在逻辑上是可能的吗?或任何替代方法来做到这一点..?