带角度的隔离范围问题

时间:2016-12-16 03:16:18

标签: angularjs angularjs-directive angularjs-scope

我正在尝试运行此程序,但我看不到输出。能否请你告诉我这里缺少的东西。提前谢谢。

<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>

2 个答案:

答案 0 :(得分:2)

看起来您将Angular应用的根目录放在标题中,而不是放在正文中。 将ng-app="myApp"属性的位置从头部更改为正文 html 元素

<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>

指令 {{myLinkText}}不存在,应重命名为{{myClick}}

答案 1 :(得分:1)

有些如何通过花一整天我能够显示文本并能够点击它但无法重定向到提到的URL,我在控制台中遇到错误Refused to display 'https://www.google.co.in/?gfe_rd=cr&ei=kepTWNDiIvLI8Afnp4HIBg' in a frame because it set 'X-Frame-Options' to 'SAMEORIGIN'.你可以找到相同的{{3 }}