gpt4 book ai didi

javascript - AngularJs 指令 : Copied code verbatim from official tutorial and it doesn't work. 为什么?

转载 作者:行者123 更新时间:2023-12-03 09:21:38 26 4
gpt4 key购买 nike

官方教程来自这里: https://docs.angularjs.org/guide/directive

我从“创建指令”的子标题“模板扩展指令”中复制了官方代码。示例 1 运行良好(该示例中只有 script.jsindex.html),我的浏览器呈现了所需的结果。示例 2 是示例 1 的简单扩展,将指令文件中的“template”行替换为“templateUrl”行,并添加 my-customer.html 文件作为模板。但是,这对我不起作用。

复制的代码如下。所有文件都放在同一个文件夹中:

  1. index3.html:

    <html lang="en">
    <head>
    <meta charset="UTF-8">
    <title>Example - example-example12-production</title>
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.3/angular.min.js"> </script>
    <script src="script3.js"></script>
    </head>
    <body ng-app="docsTemplateUrlDirective">
    <div ng-controller="Controller">
    <div my-customer></div>
    </div>
    </body>
    </html>
  2. script3.js:

    angular.module('docsTemplateUrlDirective', [])
    .controller('Controller', ['$scope', function($scope) {
    $scope.customer = {
    name: 'Naomi',
    address: '1600 Amphitheatre'
    };
    }])
    .directive('myCustomer', function() {
    return {
    templateUrl: 'my-customer.html'
    };
    });
  3. my-customer.html:

姓名:{{customer.name}} 地址:{{customer.address}}

为什么在浏览器中打开 index3.html 时出现空白页面?

最佳答案

通过在开发人员工具打开时禁用缓存来修复此问题(在 Chrome 的 js 控制台首选项中选择的选项)。代码是正确的。由于缓存的原因,它无法正确呈现。

关于javascript - AngularJs 指令 : Copied code verbatim from official tutorial and it doesn't work. 为什么?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/31824367/

26 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com