onsenui不能改變內容

我使用溫泉UI版本，緊跟https://onsen.io/v1/guide.html來修改DOMonsenui不能改變內容

本節確切

// Add another Onsen UI element 
var content = document.getElementById("my-content"); 
content.innerHTML="<ons-button>Another Button</ons-button>"; 
ons.compile(content);

的問題是沒有什麼變化的頁面上。

如果我轉儲「content」變量或轉儲HTML元素，它會在瀏覽器控制檯上顯示新編輯的版本。但在頁面上仍然是舊的。

ons對象被實例化，編譯方法被調用，嘗試了不同的HTML元素。

來源

2016-11-29 broo0d

要麼你做的不正確，要麼是角度刷新問題。

對於第一種情況，如果您提供一個codepen以便我們可以看到問題，則會更容易。目前您提到的代碼對我來說工作正常here。

對於第二種情況，實際上第三行ons.compile(content);應該刪除這個問題imo，它可能是一個版本問題，或者有一些我缺少的上下文。

如果你正在做角度相關的事情，那麼你也應該顯示你從哪裏調用這3條線。爲了工作，應該從類似於ng-事件（例如ng-click）的事件中調用它。

JS：

app.controller('yourControllerName', function($scope) { 
    $scope.addButton = function() { 
     var content = document.getElementById("my-content"); 
     content.innerHTML="<ons-button>Another Button</ons-button>"; 
     ons.compile(content); 
    } 
});

HTML：

<ons-button ng-click="addButton()">Add another button</ons-button>

最後，如果你不能讓它工作，你可以這樣做

app.controller('yourControllerName', function($scope) { 
    $scope.addButton = function() { 
     var content = document.getElementById("my-content"); 
     content.innerHTML="<ons-button>Another Button</ons-button>"; 
     ons.compile(content); 
     $scope.apply(); // should fix the issue, but not recommended 
    } 
});

PS：你也可以嘗試溫泉2 - 你可以：

實驗與interactive tutorial
試用版本香草（沒有任何外部框架） - 這將不會有這樣一個

問題

來源

2016-12-29 11:09:41

onsenui不能改變內容

回答

相關問題