AngularJS，自定义指令在@ plnkr中不起作用
[英]AngularJS , custom directive not working @ plnkr
问题描述
I have created a simple plnk @ plnkr.co. 
我创建了一个简单的plnk @ plnkr.co。 It doesn't work there. 它在那里不起作用。 However the same code works smooth in local. 但是，相同的代码在本地运行也很流畅。
plnk @ plnkr.co link plnk @ plnkr.co链接
index.html 的index.html
<!DOCTYPE html>
<html ng-app='app'>
<head>
<script data-require="angular.js@*" data-semver="1.2.6" src="https://code.angularjs.org/1.2.6/angular.js"></script>
<link rel="stylesheet" href="style.css" />
<script src="script.js"></script>
</head>
<body ng-controller='controller'>
<h1>Hello Plunker!</h1>
<div my-sample></div>
</body>
</html>
script.js 的script.js
// Code goes here
'use strict';
var app = angular.module('app',[]).
controller('controller',function($scope)
{
}).directive('mySample',function($compile)
{
return {
link : function(scope,element,attrs,controller)
{
var markup = "<input type='text' ng-model='text' />{{text}}"
angular.element(element).html($compile(markup)(scope));
}
}
});
The output in plnkr comes like : plnkr中的输出如下：
Hello Plunker! 你好，笨蛋！
[[object HTMLInputElement], [object HTMLSpanElement]] [[object HTMLInputElement]，[object HTMLSpanElement]]
strange, however when i run the same in local html it renders just fine. 奇怪，但是当我在本地html中运行相同代码时，它就很好了。 Whats going on here ?? 这里发生了什么 ？？
Also I am using angular js 1.2.6 its because thats what is being used in my work - production app ... so i am learning angular using 1.2.6 for now. 我也使用angular js 1.2.6，因为那是我的工作中使用的东西-生产应用程序...所以我现在正在学习使用1.2.6。
1 个解决方案
解决方案1
1 2015-03-08 13:11:06
You just need to compile it a little differently. 您只需要进行一些不同的编译即可。
element.html("<input type='text' ng-model='text' />{{text}}");
$compile(element.contents())(scope);
Just a quick word: I'm assuming what you did here is simplified and in your real case there is a need to compile your template, because at the moment there isn't. 简短地说：我假设您在这里所做的工作得到了简化，并且在您的实际情况下，需要编译模板，因为目前还没有。
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.