角度中的孤立范围问题 [英] Issue with Isolated scopes in angular
问题描述
我正在尝试运行此程序,但没有看到任何输出.你能告诉我我在这里缺少什么吗?提前致谢.
<head ng-app="myApp"><title>测试</title><link rel="stylesheet" href="//cdn.jsdelivr.net/foundation/4.3.2/css/foundation.min.css"><script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.0-rc.2/angular.js"></script>头部><身体><div my-directive my-url="http://www.google.com" my-click="点击我">
<脚本>angular.module('myApp',[]).directive('myDirective',function(){返回{限制:'AE',替换:真的,范围 :{我的网址:'@',我的点击:'@'},模板:'<a href="{{myURL}}">{{myLinkText}}</a>'};});</html>
看起来您将 Angular 应用程序的根放置在标题中而不是正文中.将 ng-app="myApp"
属性的位置从 head 更改为 body 或 html 元素
<!-- 新位置--><头><!-- ng-app="myApp" 它在这里--><title>测试</title><link rel="stylesheet" href="//cdn.jsdelivr.net/foundation/4.3.2/css/foundation.min.css"><script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.0-rc.2/angular.js"></script>头部>
在指令中{{myLinkText}}
不存在,应该重命名为{{myClick}}
I am trying to run this program and I see no output. Can you please let me know what I am missing here. Thanks in advance.
<html>
<head ng-app="myApp">
<title>Test</title>
<link rel="stylesheet" href="//cdn.jsdelivr.net/foundation/4.3.2/css/foundation.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.0-rc.2/angular.js"></script>
</head>
<body>
<div my-directive my-url="http://www.google.com" my-click="Click me">
</div>
</body>
<script>
angular.module('myApp',[]).directive('myDirective',function()
{
return
{
restrict : 'AE',
replace : true,
scope :
{
myURL :'@',
myClick : '@'
},
template : '<a href="{{myURL}}">{{myLinkText}}</a>'
};
});
</script>
</html>
It looks like you placed the root of your Angular app in the header and not in the body.
Change the location of the ng-app="myApp"
attribute from the head to the body or html elements
<html ng-app="myApp"> <!-- new location -->
<head > <!-- ng-app="myApp" it was here -->
<title>Test</title>
<link rel="stylesheet" href="//cdn.jsdelivr.net/foundation/4.3.2/css/foundation.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.0-rc.2/angular.js"></script>
</head>
In the directive {{myLinkText}}
does not exists, it should be renamed for {{myClick}}
这篇关于角度中的孤立范围问题的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!