AngularJS：動態ng綁定屬性

我正在做一個使用select2的指令。在我的屏幕中，我將有許多select2對象，所以這就是爲什麼我想使用一個指令，我可以重複使用它很多次。AngularJS：動態ng綁定屬性

這是指令：

<div class='form-group'> 
<p>{{title}}</p> 
<ui-select ng-model="selectedItem" on-select="onChange($item);" theme="bootstrap"> 
    <ui-select-match placeholder="{{placeholder}}"> 
     {{selectedItem.state}} 
    </ui-select-match> 

    <ui-select-choices repeat="item in items | filter: $select.search"> 
     <span ng-bind="item.state"></span> 
    </ui-select-choices> 
</ui-select>

然後，我可以做到這一點通過我的index.html文件中的參數：

<strainer-select 
        items="strainer.states" 
        selectedItem="strainer.selectedState" 
        handler="onStateChange" 
        title="Estados" 
        placeholder="Escolha um Estado" 
       ></strainer-select>

我的問題是：在選擇2我需要通知我的對象屬性「綁定」並在視圖中顯示，如下所示：

{{selectedItem.state}}

但是，當然，屬性'狀態'將不可用於所有對象。如果我有一個「城市」對象，它可以是「cityName」，或者如果我想顯示用戶，它可能只是「名稱」或「用戶名」。

我想避免做一個攔截器，並修改我的所有數據複製屬性只是爲了適應數據中的通用「名稱」。如果我的目標是：

{ 
    state: "Sao Paulo", 
    uf: "SP" 
}

我不想將其更改爲：

{ 
    state: "São Paulo", 
    uf: "SP", 
    name: "São Paulo" // replicated from "state" property 
}

強制到我的指令內使用。

所以，我已經試過動態傳遞的綁定屬性名的指令是這樣的：

<strainer-select 
        items="strainer.states" 
        selectedItem="strainer.selectedState" 
        handler="onStateChange" 
        title="Estados" 
        placeholder="Escolha um Estado" 
        bindName="state" 
       ></strainer-select>

而在該指令像這樣使用它：

<span ng-bind="item.{{bindName}}"></span> // didnt work 
<span ng-bind="item[{{bindName}}]"></span> // didnt work 
<span ng-bind="item['{{bindName}}']"></span> // didnt work

和UI選 - 匹配看起來最差....

<ui-select-match placeholder="{{placeholder}}"> 
    {{selectedItem["{{bindName}}"]}} // didnt work 
</ui-select-match>

但沒有成功。

有沒有人有線索我如何動態更改ng-bind使用的屬性名稱？

謝謝。

來源

2016-05-23 ppalmeida

嘗試

<span ng-bind="item[bindName]"></span> 

<ui-select-match placeholder="{{placeholder}}"> 
    {{selectedItem[bindName]}} 
</ui-select-match>

雖然在ng-bind你不需要逃避使用你正在編寫原始代碼的變量 - 因此你爲什麼需要引用和字符串的直接用途。

來源

2016-05-23 13:57:57

感謝工作，但沒有與任何「綁定」名稱中的東西。我猜Angular引擎可能會以某種方式解析「綁定」這個詞。所以我最終'''fillable'''： '''的 \t \t \t {{將selectedItem [可填寫]}} \t \t'''和'''span_ng-bind =「item [fillable]」>>'''。謝謝。 – ppalmeida

只是爲了補充信息，以防止任何人墜入此處：在名稱中「綁定」某物沒有問題。不使用HTML中的「綁定名稱」，而是使用「綁定名稱」。在這裏檢查AngularJS文檔：https：//docs.angularjs.org/guide/directive（規範化部分：最佳實踐：優先使用以短劃線分隔的格式（例如ngBind的ng-bind）。）。謝謝。 – ppalmeida

AngularJS：動態ng綁定屬性

回答

相關問題