загрузить и скомпилировать угловую директиву по требованию

Question

загрузить и скомпилировать угловую директиву по требованию

0

Я недавно сказал, изучая угловые js..Пожалуйста, помогите мне. Я пытаюсь загрузить и скомпилировать угловую директиву по запросу (onclick). Я могу загрузить файл директивы (mydiv.js), но mydiv.js файл не компилируется.. Вот мой код..

index.html

<html>
<head>
<script src="jquery.min.js"></script>
<script src="angular.js"></script>
<script type="text/javascript" src="app.js"></script>
</head>

<body>
<div ng-app="app">
<button type="button" onclick="disply_directive()">Click</button>
<my-directive ng-init="init()"></my-directive>
</div>
</body>
</html>

app.js

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

var disply_directive = function () {
 load_scripts('mydiv.js');
}

var load_scripts = function(url) {
if (url) {
var script = document.querySelector("script[src*='"+url+"']");
if (!script) {
var heads = document.getElementsByTagName("head");
if (heads && heads.length) {
var head = heads[0];
if (head) {
script = document.createElement('script');
script.setAttribute('src', url);
script.setAttribute('type', 'text/javascript');
head.appendChild(script);
}}}
return script;
}};

mydiv.js

app.directive('myDirective', function ($http) {
return {
template: '<h1>Hello World!</h1>',
strict: 'E',
link: function(scope) {
},
controller: function($scope) { 
$scope.init = function() {
alert("Hello World!");
console.log("Hello World!");
};
}
};
});

Здесь я не добавляю mydiv.js src в index.html.. Теперь onclick кнопки он загружает js файл, но не отображает. Где мне нужно изменить код. Спасибо..

Siddu 02 авг. 2016, в 13:28

Источник

Теги:

javascript

angularjs

2 ответа

0

Вам следует включить файл mydiv.js в файл index.html, а не вызвать onCLick().

<html>
<head>
<script src="jquery.min.js"></script>
<script src="angular.js"></script>
<script type="text/javascript" src="app.js"></script>
<script type="text/javascript" src="path_to_file/mydivjs"></script>
</head>

<body>
<div ng-app="app">
<button type="button" onclick="disply_directive()">Click</button>
<my-directive ng-init="init()"></my-directive>
</div>
</body>
</html>

Vora Ankit 02 авг. 2016, в 08:01

0

спасибо за повтор, на самом деле я пытаюсь загрузить директиву по требованию, если она включена в index.html, то файл mydev.js будет загружен только при загрузке страницы, я пытаюсь избежать этого ..
Nikhil Deshpande 02 авг. 2016, в 11:11

Ещё вопросы

спасибо за повтор, на самом деле я пытаюсь загрузить директиву по требованию, если она включена в index.html, то файл mydev.js будет загружен только при загрузке страницы, я пытаюсь избежать этого ..

Siddu · Accepted Answer · 2016-08-03T06-20-00.000Z

Я получил решение, используя oclazyload - загружать модули по требованию (ленивая загрузка), here is my плукер !

ссылка: https://oclazyload.readme.io/docs

Спасибо...