Добавьте новый тег с событием, используя angularjs

Question

Добавьте новый тег с событием, используя angularjs

0

Мне нужно добавить новый тег html с событием в нем, например:

<html ng-app="module">
<head>
<script src="http://code.jquery.com/jquery-latest.min.js" type="text/javascript"></script>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.16/angular.min.js"></script>
</head>
<body ng-controller="clickTest">
<div>
<input type="button" value="button1" ng-click="click($event)">
</div>
</body>
<script>
var module = angular.module("module", []);
module.controller("clickTest", function($scope, $http){
    $scope.click = function($event) {
        $($event.currentTarget.parentNode).append('<input type="button" value="button2" ng-click="click($event)">');  
    }
});
</script>
</html>

Как добавить событие в angularjs?

linbob 30 сен. 2015, в 07:10

Источник

1

Вы могли бы скомпилировать это. Однако вы должны действительно научиться делать с Angular способом, используя директивы, как пользовательские, так и встроенные, такие как ngRepeat.
dfsq 30 сен. 2015, в 04:58
0

Вы должны научиться принимать «Угловой путь», который разрабатывается вокруг ваших данных, а не вокруг вашего DOM. Вы должны редко вставлять элементы произвольной формы таким образом.
Claies 30 сен. 2015, в 05:38
0

Понятно, я постараюсь освоить «Угловой путь», мне потребуется время, чтобы выучить его
linbob 30 сен. 2015, в 06:48

Показать ещё 1 комментарий

Теги:

javascript

angularjs

1 ответ

Ещё вопросы

Вы могли бы скомпилировать это. Однако вы должны действительно научиться делать с Angular способом, используя директивы, как пользовательские, так и встроенные, такие как ngRepeat.
Вы должны научиться принимать «Угловой путь», который разрабатывается вокруг ваших данных, а не вокруг вашего DOM. Вы должны редко вставлять элементы произвольной формы таким образом.
Понятно, я постараюсь освоить «Угловой путь», мне потребуется время, чтобы выучить его

Dharmesh Sharma · Answer 1 · 2015-09-30T04-06-00.000Z

Попробуй это

<section ng-app="myApp" ng-controller="MainCtrl">
    <addbuttonsbutton></addbuttonsbutton>
    <div id="space-for-buttons"></section>
</section>

var myApp = angular.module('myApp', []);

function MainCtrl($scope) {
	$scope.count = 0;
}

//Directive that returns an element which adds buttons on click which show an alert on click
myApp.directive("addbuttonsbutton", function(){
	return {
		restrict: "E",
		template: "<button addbuttons>Click to add buttons</button>"
	}
});

//Directive for adding buttons on click that show an alert on click
myApp.directive("addbuttons", function($compile){
	return function(scope, element, attrs){
		element.bind("click", function(){
			scope.count++;
			angular.element(document.getElementById('space-for-buttons')).append($compile("<div><button class='btn btn-default' data-alert="+scope.count+">Show alert #"+scope.count+"</button></div>")(scope));
		});
	};
});

//Directive for showing an alert on click
myApp.directive("alert", function(){
	return function(scope, element, attrs){
		element.bind("click", function(){
			console.log(attrs);
			alert("This is alert #"+attrs.alert);
		});
	};
});

хотя это, безусловно, работает, на самом деле это образ мышления JQuery, а не образ мышления Angular.