动态设置uib-typeahead属性
动态设置uib-typeahead属性
提问于 2016-08-30 01:25:27
我有一个包装uib-typeahead的指令，问题是我想用不同的对象数组填充uib-typeahead，这意味着数组中对象的键有不同的名称。
包装uib typeahead的指令
<input-text-material-typeahead input-model="rendimiento.operador" label-model="textType" holder="Destino" color="#5E35B1" lista="Operadores" label="Destino"></input-text-material-typeahead>这就是内脏
ng.app.directive('inputTextMaterialTypeahead', function() {
return{
restrict:'EA',
scope:{
holder:'@',
color:'@',
lista:'@',
item:'@',
inputModel:'=',
method:'@'
},
controller:function($scope, $listas, $element){
$scope.getItem = function(val){
return $listas[$scope.lista](val, function(response){
return response.map(function(item) {
return item;
});
});
}
$scope.onSelect = function($item, $model, $label){
//
$scope.inputModel = $item;
}
},
link:function(scope, element, attrs, color){
//
var input_text = element.find('#input-text');
var label_rendimiento = element.find('#label-rendimiento');
input_text.on('focus', function(){
label_rendimiento.addClass('show');
label_rendimiento.css({'color':scope.color});
element.find('.input-rendimiento').css({'border-bottom':'solid 3px '+scope.color+''});
input_text.attr('placeholder', '');
});
input_text.on('blur', function(){
if(!input_text.val()){
label_rendimiento.removeClass('show');
input_text.attr('placeholder', scope.holder);
element.find('.input-rendimiento').css({'border-bottom': 'solid 1px #BDBDBD'});
}
else{
label_rendimiento.css({'color':'#BDBDBD'});
element.find('.input-rendimiento').css({'border-bottom': 'solid 1px #BDBDBD'});
}
});
},
templateUrl:ng.components + '/input-typeahead-material.html'
}})；
指令的HTML
<div class="col-xs-12 nopad">
<label class="label-rendimiento" id="label-rendimiento">{{holder}}</label>
</div>
<div class="col-xs-12 nopad input-rendimiento">
<input ng-model="whatever" placeholder="Unidad" id="input-text" uib-typeahead="Clave as Clave.Nombre for Clave in getItem($viewValue)" typeahead-loading="loadingLocations" ng-model-options="{debounce:800}" typeahead-on-select="onSelect($item, $model, $label)"/>
<i ng-show="loadingLocations" class="glyphicon glyphicon-refresh"></i>
</div> 现在不是这样了
uib-typeahead="Clave as Clave.Nombre for Clave in getItem($viewValue)"我想要这个
uib-typeahead="{{expression}} in getItem($viewValue)"并在指令链接中设置表达式，即
scope.expression = 'Clave as Clave.Nombre for Clave';请帮帮忙，谢谢。
Stack Overflow用户
回答已采纳
发布于 2016-09-08 03:45:51
它是这样的
uib-typeahead="Label as Label[key] for Label in getItem($viewValue)"在指令说明中，我只是将'key‘添加到作用域中
scope:{
holder:'@',
color:'@',
lista:'@',
item:'@',
inputModel:'=',
key:'@'
},当指令被调用时是这样的
<input-text-material-typeahead key="Operador" input-model="rendimiento.operador" label-model="textType" holder="Destino" color="#5E35B1" lista="Operadores" label="Destino"></input-text-material-typeahead>页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/39211826
复制相关文章
相似问题
腾讯云开发者
