吐槽:第一次在簡書寫學習心得,心里莫名緊張,不吐槽太多,直接開篇
先附上angular-xeditable 文檔地址 :http://vitalets.github.io/angular-xeditable/(里面有一些小demo,可以當作參考)
下面我寫一些我自己遇到覺得有用的小東東
***千萬不要忘記在module中依賴注入"xeditable"哦
一、初步配置xeditable 的主題樣式 (還可以自定義模板樣式哦)
在全局app.js run函數中聲明 editableOptions,并在函數中設置xeditable所用的主題
app.run(['editableOptions',function(editableOptions , editableThemes){
editableOptions.theme = 'bs3';
//如:editableThemes.errorTpl = '<div data-ng-if="$error">我是錯誤的</div>'
}])
查看源碼:定義模板
二 、實現根據輸入內容自動搜索(remote搜索哦)
在xeditable中有一個指令是 Typeahead ,在ng-repeat能實現自動搜索,
引入ui-bootstrap插件?
1、在全局module中依賴引入 "ui.bootstrap",并在index中引入 ui-bootstrap-tpls.min.js
2、在這其中e-form L的表單是可以用來控制文本的開關 testForm.$show() testForm.$cancel()
vm.search = function (test) {
? ? //開始http訪問?
? ? return array //返回查詢后的數組
};
三、在ng-repeat中如何使用 editable-select
在控制器中,
$scope.showTest = function(test){
var selected = $filter('filter')(vm.testList, { id: test });
return selected.length?selected[0].name:'';
}