2015-04-01 1 views
0

Событие ng-click работает для управления временем html времени разработки, но не для управления временем выполнения. может быть связано с тем, что событие ng-click в этом случае выходит за рамки.angularjs ng-click для тегов времени выполнения не работает

HTML код

<div ng-controller="AccordionDemoCtrl"> 
<label class="checkbox"> 
       <button class="btn btn-small" ng-click="addItem()">Add Item</button> 
    <input type="checkbox" ng-model="oneAtATime" />Open only one at a time</label> 
<accordion close-others="oneAtATime"> 
    <accordion-group heading="{{group.title}}" ng-repeat="group in groups">{{group.content}}</accordion-group> 
</accordion> 
<button class="btn btn-small" onclick="f()" >Click</button> 
<div id=name> 
</div> 

Javascript Код

var app = angular.module('myapp', ['ui.bootstrap']); 
function AccordionDemoCtrl($scope) { 

$scope.oneAtATime = true; 

$scope.groups = [{ 
    title: "Dynamic Group Header - 1", 
    content: "Dynamic Group Body - 1" 
}, { 
    title: "Dynamic Group Header - 2", 
    content: "Dynamic Group Body - 2" 
}]; 

$scope.addItem = function() { 
    $scope.groups = [{ 
    title: "Dynamic Group Header - 4", 
    content: "Dynamic Group Body - 4" 
}, { 
    title: "Dynamic Group Header - 5", 
    content: "Dynamic Group Body - 5" 
}]; 
}; 
} 
function f() 
{document.getElementById("name").innerHTML = "<button id='btn2' ng-click='addItem()'>add d item</button>";} 
+0

Точка Angular позволяет вам писать декларативный и динамический HTML. Поэтому вы не должны принудительно генерировать его из своего JavaScript. Хотя вы не можете использовать JQuery, этот ответ может помочь вам: http://stackoverflow.com/questions/14994391/thinking-in-angularjs-if-i-have-a-jquery-background – rob

+0

Это плохая практика, что вы пытаетесь сделать именно это? Я вижу, что вы используете аккордеонную демонстрацию для углового ui – Ronnie

+0

Я хочу создать тезисы тезисов из данных веб-api json, обновив переменную $ scope.groups – Jinnah

ответ

0

AngularJS обычно не анализирующие HTML вы добавляете к странице во время выполнения, используя DOM, так что автоматически не поймать угловую директиву использует там. Тем не менее, вы можете сделать явный вызов после того, как вы измените страницу для ее повторной обработки. Посмотрите на: AngularJS + JQuery : How to get dynamic content working in angularjs

+0

Многие люди будут указывать на то, что если ваша страница не очень сложна, вы не должны необходимо изменить DOM непосредственно, когда вы используете AngularJS. =) Рассмотрим использование ng-if и ng-repeat. https://docs.angularjs.org/api/ng/directive/ngIf https://docs.angularjs.org/api/ng/directive/ngRepeat – rakslice

0

Рассмотрим это,

Не динамически генерировать элемент, который вы хотите угловую разобрать - вместо того, чтобы создать его в HTML. Используйте ng-show или ng-hide для динамического отображения или скрытия раздела.

Это метод, даже используемый в ходе курса, который решает аналогичную проблему на Code School.

Смежные вопросы