Я хотел бы добавить программные элементы DOM с Angular -enabled. На самом деле, вероятно, мне нужно будет добавить пользовательские компоненты. Как я могу это сделать?
Вот тривиальная сценария, чтобы продемонстрировать проблему: http://jsfiddle.net/ZJSz4/2/
HTML:
<div ng-app="main">
<div ng-controller="MyCtrl">
<button ng-click="add()" >Add</button>
<div id="container">
<div>{{test}}</div>
</div>
</div>
</div>
JS:
angular.module("main", []).controller("MyCtrl", function($scope) {
$scope.add = function() {
$("#container").append("<div>{{test}}</div>");
};
$scope.test = 'Test Message';
});
На всякий случай, я ожидаю, что он добавит div, показывающий "Test Message" для каждого клика - не {{test}}.
Зачем мне это нужно? Ну, я хотел бы иметь несколько сортируемых столбцов (в jQuery сортируемом смысле) с портлетами. Я предполагаю, что каждый портлет может быть компонентом.
Я поднимаюсь на неправильный холм? Что такое Angular способ решить эту проблему?
EDIT. Я надеялся, что этот упрощенный пример не закончится так, но в любом случае. Конечной целью является не отображение div для каждого элемента в массиве.
Чего я действительно хочу, это более сложный контроллер. Мне нужен контейнер портлетов с интересным поведением. Возможно, потребуется решить разместить каждый портлет в другом столбце. Он может предлагать изменение макета и иметь достойный способ реорганизации портлетов в таком случае. И так далее.