gpt4 book ai didi

javascript - 带有 ng-model 的 Angular 1.5 组件

转载 作者:行者123 更新时间:2023-12-03 01:19:43 25 4
gpt4 key购买 nike

是否可以将 ng-model 与组件一起使用?我想使用 ng-model 将范围变量绑定(bind)到组件。我有plunkered my issue 。我希望将组件 my-input 绑定(bind)到 userData.name 范围内的变量。

我正在使用 Angular JS 1.5.6 组件,并且希望避免使用指令。

<body ng-controller="MyCtrl">
<div class="container">
<h2>My form with component</h2>
<form role="form">
<div class="form-group">
<label>First name</label>
<my-input placeholder="Enter first name" ng-model="userData.name"></my-input>
</div>
</form>
</div>
</body>

最佳答案

您可以使用此代码:

function myInputController($scope) {
var self = this;
this.$onInit = () => {
this.ngModel.$render = () => {
self.model = self.ngModel.$viewValue;
};
$scope.$watch(function() { return self.model; }, function(value) {
self.ngModel.$setViewValue(value);
});
};
}
module.component('myInput', {
require: {
ngModel: '^ngModel'
},
template: '<input ng-model="vm.model"/>',
controller: myInputController,
controllerAs: 'vm'
};

关于javascript - 带有 ng-model 的 Angular 1.5 组件,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/37923261/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com