当前位置: 首页 > 面试题库 >

如何使AngularJS编译指令生成的代码?

闾丘昊然
2023-03-14
问题内容

请帮助我,如何使AngularJS编译指令生成的代码

您甚至可以在这里找到相同的代码,http://jsbin.com/obuqip/4/edit

的HTML

<div ng-controller="myController">
    {{names[0]}} {{names[1]}}
    <br/> <hello-world my-username="names[0]"></hello-world>
    <br/> <hello-world my-username="names[1]"></hello-world>
    <br/><button ng-click="clicked()">Click Me</button>
</div>

Java脚本

var components= angular.module('components', []);
components.controller("myController",
    function ($scope) {
        var counter = 1;
        $scope.names = ["Number0","lorem","Epsum"];
        $scope.clicked = function() {
            $scope.names[0] = "Number" + counter++;
        };
    }
);

// **Here is the directive code**
components.directive('helloWorld', function() {
    var directiveObj =  {
        link:function(scope, element, attrs) {
            var strTemplate, strUserT = attrs.myUsername || "";
            console.log(strUserT);
            if(strUserT) {
                strTemplate = "<DIV> Hello" + "{{" + strUserT +"}} </DIV>" ;
            } else {
                strTemplate = "<DIV>Sorry, No user to greet!</DIV>" ;
            }
            element.replaceWith(strTemplate);
        },
        restrict: 'E'
    };
    return directiveObj;
});

问题答案:

这是一个既不使用编译功能也不使用链接功能的版本:

myApp.directive('helloWorld', function () {
  return {
    restrict: 'E',
    replace: true,
    scope: {
      myUsername: '@'
    },
    template: '<span><div ng-show="myUsername">Hello {{myUsername}}</div>'
    + '<div ng-hide="myUsername">Sorry, No user to greet!</div></span>',
  };
});

请注意,模板被包装在中,因为模板需要具有一个根元素。(如果没有,它将有两个

根元素。)

需要对HTML进行少许修改以进行插值:

<hello-world my-username="{{names[0]}}"></hello-world>

小提琴。



 类似资料:
  • 我的分析器已将以下函数分析确定为热点。 特别是一条汇编指令MOVZX(零扩展移动)负责运行时的大部分。if语句编译为 我想诱使编译器不生成这条指令,但我想我首先需要了解为什么会生成这条指令。考虑到我正在使用相同的数据类型,为什么要使用加宽/零扩展? (在godbolt编译器资源管理器上找到整个函数。)

  • 为了在运行windows 7 pro的intel core 2上完成一些cmov指令,我编写了以下代码。它所做的就是从控制台获取一个字符串作为输入,应用一些移位操作来生成一个随机种子,然后将该种子传递给srand,以生成一个小的伪随机数数组。然后评估伪随机数是否满足谓词函数(更任意的位随机),并输出“*”或“\u1”。实验的目的是生成cmov指令,但正如您在下面的反汇编中所看到的,没有。 有没有关

  • 问题内容: 我正在d3可视化中尝试使用angularjs 工具提示指令,所以我有类似 但是,工具提示未显示。我需要什么吗?我也尝试过将它包装起来,但这没有用。 问题答案: 我有一个类似的问题,是的,用解决了。我假设您的d3代码位于自定义指令中。从那里可以添加工具提示属性,删除自定义指令属性,以便$ compile仅运行一次,然后调用$ compile: $ compile服务可确保使用指令添加的属

  • 有没有办法让Clang、GCC或VS仅使用标准-C(98/11/14)生成adc(带进位添加)指令?(编辑:我的意思是在x64模式下,如果不清楚,对不起。)

  • 问题内容: 我正在使用angularjs 1.2.0-rc.3。我想将html代码动态地包含到模板中。为此,我在控制器中使用: 在模板中,我得到了: 它适用于常规html代码。但是,当我尝试放置角度模板时,它不会被解释,它仅包含在页面中。例如,我想包括: 非常感谢 问题答案: 此解决方案不使用硬编码模板,您可以编译嵌入在API响应中的Angular表达式。 步骤1. 安装此指令:https : /

  • 问题内容: 可以说,我的Java程序的瓶颈确实是一些紧密的循环,无法计算一堆矢量点积。是的,我已经进行了概要分析,是的,它是瓶颈,是的,它很重要,是的,这就是算法的方式,是的,我运行了Proguard来优化字节码,等等。 实质上,这是点产品。与之类似,我有两个,我需要计算成对乘积之和。我知道处理器指令集可以像SSE或MMX一样快速且批量地执行此类操作。 是的,我可能可以通过在JNI中编写一些本机代