让我们来看看我的指令:
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模型的值呢？
我有一个异步验证器:
app.directive('validateBar', ['$http', function($http) {
function link($scope, $element, $attrs, ngModel) {
ngModel.$asyncValidators.myValidator = function(value) {
return $http.get('/endpoint/' + value);
};
}
return {
require: 'ngModel',
link: link
};
}]);
表格模板:
<form name="myForm" ng-submit="foo.$valid && saveForm()">
<input name="bar" ng-model="bar" data-validate-bar>
<p ng-show="myForm.bar.$error.myValidator">Your bar is wrong</p>
<button disabled="myForm.$invalid">
</form>
问题:我希望我的随附表格在myValidator承诺未决时无效.
我知道有两种方法可以在异步验证器处于挂起状态时使表单无效,但它们都是冗长和/或hacky.
// Workaround 1: Mark another validator as invalid while the validator promise is pending.
// I cannot mark 'myValidator' as invalid, gets set to valid immediately by Angular.
app.directive('validateSomething', …由于某种原因,初始值不会出现在字段中,但没有ng-pattern的第二个字段确实有效.有任何想法吗？
angular.module('app', []).controller('MainCtrl', function($scope) {
$scope.widget = {title: 'abc', title2: 'abc'};
});
<div ng-app="app" ng-controller="MainCtrl">
<input ng-model="widget.title" required ng-pattern="/[a-zA-Z]{4}[0-9]{6,6}[a-zA-Z0-9]{3}/">
<br /><br />
input 1: {{ widget.title }}
<br /><br />
<input ng-model="widget.title2" required>
<br /><br />
input 2: {{ widget.title2 }}
</div>
我在我的范围内有一个对象列表,并希望迭代它们,以有序的属性方式显示它们的一些属性并更改它们.
ng-repeat用于显示绑定到列表中每个对象的文本框,以及使用"position"作为参数的orderby过滤器.
再次,位置也是可编辑的!
现在我们改变某个对象的位置一次(角度按预期重新排列列表),然后改变两次.Angular不会重新排序列表.
任何人都可以解释如何修复这种仅重新排序的情况以及这种行为的原因是什么？
这是小提琴:JSFiddle
HTML
<div ng-controller="MyCtrl">
<p>List of activities:</p>
<div ng-repeat="activity in model.activities | orderBy: 'position'">
<textarea type="text" ng-model="activity.name">
</textarea>
{{activity.name}}
<input type="text" ng-model="activity.position">
</div>
</div>
JS
var myApp = angular.module('myApp',[]);
function MyCtrl($scope) {
$scope.model = {
activities: [
{name: "activity 1", position: 1},
{name: "activity 2", position: 2},
{name: "activity 3", position: 3},
{name: "activity 4", position: 4},
{name: "activity 5", position: 5}
]
};
}
在这个例子中,我有一个附加指令的输入.该指令用于显示输入旁边的消息.还有另一个输入和一个添加消息的按钮.显示某些消息后,使用附加指令关注输入应清除消息. http://jsfiddle.net/viro/WBqxf/
所以我有一个带有隔离模型的指令,我正在尝试在具有指令的元素成为焦点时更新模型.好像我必须在事件范围内包装事件回调.$ apply如果我想更新模型:
element.on('focus',function(){
scope.$apply(function(){
console.log("focus !");
scope.tstMsg=[];
})
});
我想我必须将它包装在$ apply中,因为我正在使用jqlite事件回调,我猜它们在"外部"angularJS中运行,但我没有在文档中明确说明它.
我做得对吗还是黑客攻击？
有没有更好的方法呢？
我正在开展一个角度项目,我需要根据一系列问题创建一个表单.我想ng-model为数组中的每个问题创建.
所以我想出了类似下面的东西,但它没有用.
<div class="form-group" data-ng-repeat="question in questions">
<label for="{{question.label}}" class="col-md-2 control-label">
{{question.label}}:
</label>
<div class="col-md-10">
<input type="text"
class="form-control"
name="{{question.label}}"
data-ng-model={{question.label}}
required />
<span class="error"
data-ng-show="formQuickView.{{question.label}}.$error.required">
Required!
</span>
</div>
</div>
有人可以帮我解决这个问题吗？
谢谢你提前.
例如,我想做这样的事情:
<select ng-model="persons">
<option value="person1">Anna Smith</option>
<option value="person2">Karl Pettersson</option>
<option value="person3">Ylvis Russo</option>
</select>
<p ng-view="persons"><p>
并且在下拉列表中选择时,视图会显示每个名称,而不是它的值.可能吗？
我尝试观察模型并使用jQuery为文本值分配新模型.然而它最终变得复杂,所以如果这是最好的方式,我的小例子将是真棒!
我正在查看用于处理表单的Angular 文档,并找到了一个非常有用的示例,用于在任何字段/控件中捕获更新并延迟.以下是Angularjs提供的示例代码:
<input type="text" ng-model="user.name" ng-model-options="{ debounce: 250 }" /><br />
它工作正常.但他们提到debounce可以与多个事件一起使用,并提供另一个例子,如:
<input type="text" ng-model="user.name" ng-model-options="{ updateOn: 'default blur', debounce: { default: 500, blur: 0 } }" /><br />
此示例的问题在于,无论您是否离开字段/控件,它总是会延迟更新.而在这种情况下,应立即更新模型,当用户离开现场/控制,debounce为0的情况下blur.
谁能解释这种行为.