Angular ngOptions切片或橢圓

我有一些非常長的句子顯示在ngOptions中，我從api填充..我如何切片em，所以我最終得到類似（紅色......或藍色.. ）在字的末尾有點，...嗯，可能是我應該嘗試創建一個過濾器，我應該得到的長度的str和切片取決於我想要多少個字符..任何幫助表示讚賞。Angular ngOptions切片或橢圓

$scope.colors = [ 
    {name:'blacksomerandomwords', shade:'dark'}, 
    {name:'whitesomerandomwords', shade:'light', notAnOption: true}, 
    {name:'redsomerandomwords', shade:'dark'}, 
    {name:'bluesomerandomwords', shade:'dark', notAnOption: true}, 
    {name:'yellowsomerandomwords', shade:'light', notAnOption: false} 
]; 
<select ng-model="myColor" ng-options="color.name for color in colors"></select>

來源

2015-06-25 kam bajwa

您是否想僅剪切選定的選項或下拉菜單？ –

下拉以及其他下拉太寬..可以控制它與設置寬度或溢出隱藏，而是尋找解決方案使用javascript切片，謝謝 –

我想角度過濾器是你最好的選擇。特別是當你考慮跨瀏覽器的兼容性。 –

yourApp.filter('short', function() { 
    // pass in collection, property to shorten and max length 
    return function(values, property, length) { 
    angular.forEach(values, function(value) { 
     value[property] = value[property].length <= length ? 
         value[property] : 
         value[property].substr(0, length) + '...'; 
    }); 
    return values; 
    }; 
}); 

<select ng-model="myColor" 
     ng-options="color.name for color in colors | short:'name':6"> 
</select>

相關這裏http://plnkr.co/edit/Mvky0H

來源

2015-06-25 08:50:53

嗨Mikko，我試過你的解決方案，但我越來越=>無法讀取undefined的財產'長度' –

謝謝你多Mikko，它的工作..我正在使用=> short：'name'：6 .....但在我的實際應用程序它是full_address，所以它應該是短：'full_address'：6 :) –

plunker您可以使用CSS樣式text-overflow:ellipsis填充的效果：http://www.w3schools.com/cssref/css3_pr_text-overflow.asp。只要你限制你的選項包裝元素的寬度。

來源

2015-06-25 08:51:10 Joy

謝謝蔡，我更期待角度過濾器。但感謝你的幫助任何方式......我沒有嘗試過文本溢出：省略號但由於某種原因，它沒有工作..我嘗試添加一個類，你選擇的屬性，以及選項..但沒有好運... –

Angular ngOptions切片或橢圓

回答

相關問題