在UI.Bootstrap中使用X-editable Tabular標題指令在AngularJs中

Question

我有一個AngularJs應用程序，我們使用UI.Bootstrap標籤來創建和刪除工作區。
我想要使用的X編輯編輯工作區/標籤的名稱，但該選項卡頭指令中：

<tab-heading> 
    <span editable-text="item.title">{{item.title}}</span> 
</tab-heading> 

由於它是，它與聯編輯出現上單擊，但不保存時更新範圍。

繼承人的小提琴：http://jsfiddle.net/RDfTu/

Answer 1

如果你看一下生成的HTML：

<tabset class="ng-isolate-scope ng-scope"> 

隔離範圍不從任何範圍繼承，那麼你的 「item.title」 沒有按不存在於此範圍中，也不存在於其下的任何範圍內，您的標籤標題所在的位置以及x-editable創建它的控制器的位置。

Answer 2

我有同樣的問題，在我的情況我能使用blur屬性來解決這個問題：

<tab-heading> 
    <span editable-text="tab.name" onbeforesave="validate($data)" buttons="no" blur="submit">{{ tab.name}}</span> 
</tab-heading> 

請參閱documentation。

也請參閱xeditable.js下面的代碼：

if (shown[i]._blur === 'submit') { 
     toSubmit.push(shown[i]); 
     }