Tag: angularjs

angularJS – 从鼠标点击div中获取x和y的位置

我做了一个函数,应该添加一个项目,我点击一个div内的位置。 现在这个函数的问题是,每次我点击,它都需要文档的x和y位置,而不是div内的x和y位置。 所以我真正想要的是,我的div的左上angular应该给x = 0&y = 0,但我不知道这是可能的吗? 我想还有另一种方法可以做到这一点.. $scope.addOnClick = function(event) { $scope.items.push( { "label": "Click", "value": 100, "x": event.x-50, "y": event.y-50, }) }

在同一指令的链接函数内使用指令控制器中的函数

也许我对于指令控制器是如何工作有一个基本的误解,据我所知,他们被用作一种API暴露给其他指令和控制器。 我试图让控制器和链接function进行内部沟通。 例如,我希望能够通过控制器function设置一个variables,然后在链接函数中使用它: var app = angular.module('test-app', []); app.directive('coolDirective', function () { return { controller: function () { this.sayHi = function($scope, $element, $attrs) { $scope.myVar = "yo" } }, link: function(scope, el, attrs) { console.log(scope.myVar); } } }); 如何在链接function中访问myVar或sayHi? 还是我完全错过了这一点?

如何操作AngularJS中的指令样式?

我正在使用AngularJS和AngularJS指令编写一个组件。 我正在做这样的事情: var MyApp = angular.module('MyApp', []); MyApp.directive('myTag', function() { return { /* Some logic here*/ } }); 我想能够改变我的组件的风格(使用CSS),如下所示: <my-tag class="MyClass"></my-tag> 除此之外,我希望能够操作组件内的所有元素样式(my-tag内的HTML标记)。 你有什么build议或有用的例子如何操纵使用AngularJS自定义标签的风格属性?

如何让AngularJS输出转义HTML

我从服务器获取JSON数据,其中一个字段包含转义的html(实际上是一个电子邮件正文): &lt;html&gt;\r\n&lt;head&gt;\r\n&lt;meta http-equiv=&quot;Content-Type&quot; content=&quot;text/html; charset=iso-8859-1&quot;&gt;\r\n&lt;/head&gt;\r\n&lt;body dir=&quot;auto&quot;&gt;\r\n&lt;div&gt;Buonasera, ho verificato i dati sul mio account ed il numero di cell che vi ho fornito&lt;/div&gt;\r\n&lt;div&gt;&lt;br&gt;\r\n&lt;a &lt;html&gt;\r\n&lt;head&gt;\r\n&lt;meta http-equiv=&quot;Content-Type&quot; content=&quot;text/html; charset=iso-8859-1&quot;&gt;\r\n&lt;/head&gt;\r\n&lt;body dir=&quot;auto&quot;&gt;\r\n&lt;div&gt;Buonasera, ho verificato i dati sul mio account ed il numero di cell che vi ho fornito&lt;/div&gt;\r\n&lt;div&gt;&lt;br&gt;\r\n&lt;a (更多…) 我正在尝试使用AngularJs渲染它。 以下不起作用: <div ng-bind-html-unsafe="mail.htmlbody"></div> 我认为这是正常的,因为HTML实际上逃脱了。 我应该先find它吗? Angular是否能够通过一些可用的服务来避免使用html? 如果我使用这样的$ sce: scope.mail.htmlbody = […]

Angularjs $ http和进度条

我需要上传文件,我使用$ http(这个代码是从我的.service()函数): sendFile: function (params) { return $http({method : 'post', url : 'http://XXXXXXXXXXXXX/rest/file.json', headers : { 'X-CSRF-Token' : $cookies['csrftoken']}, data : params }) }, 现在,对于小文件和好行来说没有问题,但是对于大文件和/或坏/慢行来说,存在UI的问题:用户无法知道上传何时结束。 我需要一个进度条。 所以我在互联网上search,但我还没有find解决scheme。 有没有可能从$ http获得一些进展/通知? 我已经试过这个代码没有运气: ProfileService.sendFile(data) .then(function(ret) { var uri = ret.data.uri; scope.content = "Upload finished"; scope.postForm.fid = ret.data.fid; scope.postForm.buttonDisabled = false; }, function(error) { scope.postForm.showError = true; scope.postForm.errorMsg = […]

如何用angularjs在视图中检查ng-if值为null?

我有这种情况 <div ng-repeat="test in current"> <div ng-if="test.view == null"> <i class="icon ion-checkmark"></i> </div> </div> 但test.view== null不起作用,既不检查test.view或test.view == '' 有任何想法吗? 谢谢 编辑: 在循环中,有时test.view有一个值,如果我这样做有时是NULL: <div ng-if="!test.view">1</div> <div ng-if="test.view">2</div> 我只会看到1

提交表单angularjs后显示所有无效字段的红色边框

我有一个表单,我有一些input字段。 其中一些是必填字段,一些是电子邮件字段。 我正在使用必填字段的HTML5 必填属性和电子邮件字段的type =“email”属性。 我的问题是点击提交button后,我必须显示所有无效字段的红色边框 。 这是我的forms <form name="addRelation"> <label>First Name</label> <input type="text" placeholder="First Name" data-ng-model="model.firstName" id="FirstName" name="FirstName" required/><br/> <span class="text-error" data-ng-show="addRelation.submitted && addRelation.FirstName.$error.required">first Name is required</span><br/> <label>Last Name</label> <input type="text" placeholder="Last Name" data-ng-model="model.lastName" id="LastName" name="LastName" required/><br/> <span class="text-error" data-ng-show="addRelation.submitted && addRelation.LastName.$error.required">Last Name is required</span><br/> <label>Email</label> <input type="email" placeholder="Email" data-ng-model="model.email" id="Email" name="Email" required/><br/> <span […]

Angularjs承诺在1.2中不绑定模板

升级到1.2后,由我的服务返回的承诺行为不同…简单的服务myDates: getDates: function () { var deferred = $q.defer(); $http.get(aGoodURL). success(function (data, status, headers, config) { deferred.resolve(data); // we get to here fine. })…… 在早期版本中,我可以在我的控制器中做: $scope.theDates = myDates.getDates(); 而getDates返回的promise可以直接绑定到Select元素。 现在这不起作用,我不得不在我的控制器提供一个callback的承诺或数据将不会绑定: $scope.theDates = matchDates.getDates(); $scope.theDates.then(function (data) { $scope.theDates = data; // this wasn't necessary in the past 该文件仍然说: $ q承诺被模板引擎以angular度识别,这意味着在模板中,您可以将附加到范围的承诺视为结果值。 他们(承诺)在旧版本的Angular工作,但在1.2 RC3自动绑定失败,在我所有的简单服务….任何想法,我可能做错了什么。

AngularJS – 如何改变自定义指令ngModel的值?

让我们看看我的指示: angular.module('main').directive('datepicker', [ function() { return { require: '?ngModel', link: function(scope, element, attributes, ngModel) { ngModel.$modelValue = 'abc'; // this does not work // how do I change the value of the model? 那么,如何改变ng模型的价值呢?

AngularJS错误:$注射器:未知未知的提供者

我试图通过遵循工厂方法文档中的示例来构build自己的服务。 我认为我做了错误的事情,但因为我继续得到未知的提供商错误。 这是我的应用程序的代码,包括声明,configuration和工厂定义。 编辑我已经添加了所有的文件来帮助排除故障 编辑错误的全部细节下面的问题似乎与getSettings,因为它正在寻找getSettingsProvider,找不到 Error: [$injector:unpr] http://errors.angularjs.org/1.2.16/$injector/unpr? p0=getSettingsProvider%20%3C-%20getSettings at Error (native) at http://localhost/sw/selfservice/bower_components/angular/angular.min.js:6:450 at http://localhost/sw/selfservice/bower_components/angular/angular.min.js:35:431 at Object.c [as get] (http://localhost/sw/selfservice/bower_components/angular/angular.min.js:34:13) at http://localhost/sw/selfservice/bower_components/angular/angular.min.js:35:499 at c (http://localhost/sw/selfservice/bower_components/angular/angular.min.js:34:13) at d (http://localhost/sw/selfservice/bower_components/angular/angular.min.js:34:230) at Object.instantiate (http://localhost/sw/selfservice/bower_components/angular/angular.min.js:34:394) at http://localhost/sw/selfservice/bower_components/angular/angular.min.js:66:112 at http://localhost/sw/selfservice/bower_components/angular/angular.min.js:53:14 angular.js:9778 (anonymous function) angular.js:9778 (anonymous function) angular.js:7216 h.$apply angular.js:12512 (anonymous function) angular.js:1382 d angular.js:3869 $bc angular.js:1380 $b angular.js:1394 Wc […]