2016-03-14 79 views
0

我試圖用ng模型的輸入替換我的文本中的特定字符串。我用下面的代碼:Angular ng模型不起作用

inlinetext.replace(buffer[x], '<input ng-model="singleQuestion.inlines[' + x + '].checkAnswer" type="text">'); 

它呈現HTML輸入字段鑑於預期:

<input ng-model="singleQuestion.inlines[0].checkAnswer" type="text"> 

但是NG-模式將不會更新模型。我實際上已經嘗試在HTML視圖中對同一段代碼進行硬編碼,並且它完美地工作。所以它必須是角度渲染視圖的方式。

我的目標是顯示文本段落,其中特定字詞用輸入替換(使用ng-model屬性)。問題在於Angular不會編譯任何通過.replace()函數放入的視圖。

有沒有人有一些想法如何做到這一點?

+1

猜你需要編譯元素代替HTML,像'$編譯(yourElement)(範圍)後;' –

+0

無法運作。我創建指令 'app.directive( '動態',函數($編譯){ 回報{ 限制: 'A', 取代:真實, 鏈接:功能(範圍,ELE,ATTRS){ 範圍$觀看(attrs.dynamic,函數(HTML){ ele.html(HTML); $編譯(ele.contents())(範圍); });} }; });' 和將輸出更改爲: 'inlinetext.replace(buffer [x],'

');' 或者您是否有其他想法? –

+0

對不起,我不明白你想達到什麼。你能發佈更多的指令代碼,以及它是如何被使用的? –

回答

0

最後我找到了正確的方法。這裏是完整的代碼替換字符串與Angular編譯元素,以防萬一需要它。

<script> 
    var testApp = angular.module('testApp', []); 

    testApp.directive('dynamic', function ($compile) { 
    return { 
     restrict: 'A', 
     replace: true, 
     link: function (scope, ele, attrs) { 
     scope.$watch(attrs.dynamic, function(html) { 
      ele.html(html); 
      $compile(ele.contents())(scope); 
     }); 
     } 
    }; 
    }); 

    testApp.controller('PhoneListCtrl', function ($scope) { 

    // Initializace text 
    var inlinetext = 'Lorem ipsum dolor form sit amet, consectetur adipiscing elit. Vivamus in form ultricies ipsum. Quisque finibus lacus neque, sed tempor lectus form gravida nec. Nam egestas dui vel elit lacini'; 

    // Replace string and bind it to directive 
    $scope.html = inlinetext.replace('form', '<input type="text" ng-model="demo">'); 
}); 
</script> 

這是result