創建自定義的角度，引導預輸入數據

我有自舉的UI，預輸入指令創建列表麻煩

的$ HTTP調用返回以下JSON：

[{"title":"FOO", "equipment":[{"model":"Model 1"}, {"model":"Model 2"}], "combine":"true"}]

我需要做的是：

拼接的標題是「FOO」用戶在輸入字段已經輸入的輸入和
創建一個設備列表：「模型1」和「模型2」（實際下拉數據）作爲兩個獨立的下拉項目或連接「模型1」和「模型2」如果「組合」爲設置爲「true」，這將只產生 ONE下拉項。

一旦在下拉列表中點擊其中一個「設備」條目，我需要調用一個函數，將所選模型設置在服務對象中，然後調用$ location的url函數。

這可能嗎？

下面是我使用的模板，通過「預輸入模板的URL」：你需要更新你的模板

<input typeahead="val for val in autoComplete($viewValue)" 
    typeahead-template-url="searchAutocompleteTpl.html" 
    ng-model="query"/> 

<script type="text/ng-template" id="searchAutocompleteTpl.html"> 
    <span>found in: </span> 
    <div ng-repeat="eqp in match.model.equipment"> 
    <a href="" ng-click="showItem(eqp.model)"> 
     {{eqp.model}} 
    </a> 
    </div> 
</script>

來源

2013-08-28 recalcitrant

這是絕對可能的，無需自定義模板IMO。如果你可以把你的代碼放在笨重的地方，我可以擺弄它。 –

這不完全是你的問題，但你可以看看這裏，並可能找到一些靈感來擺弄你的數據：https：//stackoverflow.com/questions/20220399/angularjs-ui-bootstrap-typeahead-with-an-heterogeneous -data陣列 – domokun

：

<script type="text/ng-template" id="searchAutocompleteTpl.html"> 
    <span>found in: {{match.model.title}}{{query}}</span> 
    <div ng-show="match.model.combine=='true'" ng-repeat="eqp in match.model.equipment"> 
    <a href="" ng-click="showItem(eqp.model)"> 
     {{eqp.model}} 
    </a> 
    </div> 
    <div ng-show="match.model.combine=='false'"> 
    <a href="" ng-click="showItem(eqp.model)" ng-repeat="eqp in match.model.equipment"> 
     {{eqp.model}} 
    </a> 
    </div> 
</script>

對於你的問題1檢查<span>found in: {{match.model.title}}{{query}}</span>。通過模型「查詢」，您可以訪問輸入的值並使用它連接標題。

對於問題2，我習慣了不同的div，並根據組合值僅顯示適當的值。

我也做了一個Fiddler，我希望它可以幫助（這不是一個美麗，但工程）。

ZoliR

來源

2016-02-10 16:14:23

創建自定義的角度，引導預輸入數據

回答

相關問題