[英]Directive two way binding watch property
我正在嘗試在我的angularjs應用程序中使用指令,這是我嘗試應用的第一個指令,因此我不確定它是否正確。
事情是,我想將ui-select指令包裝到另一個指令中,然后如果要選擇新值,則要監視selec。 我可以填充選擇,但我不知道為什么它不觸發手表...這是控制器:
.controller('IngredientesDatosGeneralesController' ,['$scope', 'PrivateAlergenosUtilsService',
'PrivateRestauranteService', 'PrivateIngredienteService',
function($scope, PrivateAlergenosUtilsService, PrivateRestauranteService,
PrivateIngredienteService){
var _this = this;
_this.PrivateIngredienteService = PrivateIngredienteService;
_this.proveedorSeleccionado = null;
_this.proveedores = [];
PrivateRestauranteService.getProveedores().then(
function(proveedores){
_this.proveedores = proveedores;
},
function(error){
_this.proveedores = [];
}
);
$scope.$watch('cntrl.proveedorSeleccionado', function(newValue,oldValue){
if (newValue && newValue!=oldValue){
_this.PrivateIngredienteService.getIngregienteDTO().id = _this.proveedorSeleccionado.id;
}
}, true);
}]);
以下是指令:
.directive('comboDirective', [
function(){
return {
restrict : 'E',
templateUrl: 'resources/js/private/views/utils/combo/combo.html',
scope : {
seleccionado : '=',
elementos : '=',
descripcion : '@'
}
}}]);
combo.html:
<div class="col-xs">
<label translate>{{descripcion}}</label>
</div>
<div class="col-xs">
<div class="selectStyle">
<ui-select ng-model="seleccionado" theme="bootstrap" register-custom-form-control disable-validation-message="" required>
<ui-select-match placeholder="{{'input.seleccionar' | translate}}">{{$select.selected.descripcion}}</ui-select-match>
<ui-select-choices repeat="elemento in elementos | filter: $select.search">
<div ng-bind-html="elemento.descripcion | highlight: $select.search"></div>
</ui-select-choices>
</ui-select>
<i class="fa fa-chevron-down"></i>
</div>
</div>
最后,這就是我調用指令的方式:
<div ng-controller="IngredientesDatosGeneralesController as cntrl">
<combo-directive
seleccionado="cntrl.proveedorSeleccionado"
descripcion="formulario.proveedor"
elementos="cntrl.proveedores">
</combo-directive>
</div>
提前致謝
我發現發生了什么...我不知道為什么,但是如果我將此配置放在指令中並使用“ cntrl”。 HTML中“ seleccionado”和“ elementos”值之前的前綴,它可以正常工作。
'use strict';
angular.module("private.directives")
.directive('comboDirective', [
function(){
return {
restrict : 'E',
templateUrl: 'resources/js/private/views/utils/combo/combo.html',
scope : {
seleccionado : '=',
elementos : '=',
descripcion : '@'
},
controller : ['$scope', function ($scope) {
}],
controllerAs : 'cntrl',
bindToController: true
}
}]);
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.