时间戳

首页 > 解决方案 > angularJS中的<和@范围隔离有什么区别？

ruby-on-rails - angularJS中的<和@范围隔离有什么区别？

问题描述

我的 Rails 应用程序有不同的组织，他们的个人资料页面有自己的库存统计表。

下面写的是app/views/organization/show.html.erb的部分

<div ng-app="cc-app" class="card-body overflow-hidden">
    //codes here
    <inventory-stats orgid="<%= @organization.id %>"> </inventory-stats>
    //codes here
</div>

我已经制定了一个指令来显示库存统计信息并通过 orgid 即具有范围隔离（单向绑定）的组织 ID 来获取组织的库存统计信息。据我所知，我有两种方法可以在app/assets/javascripts/angular/directives/inventoryStats.directive.js中为单向绑定定义范围对象，它们是：

任何一个

scope: {
    orgid: '@'
    }

或者，

scope: {
    orgid: '<'
    }

但只有 @ 似乎有效。使用@，$scope.orgid 给出指令范围内组织 ID 的值。如果我通过 orgid < 它的未定义。我已阅读指令的范围文档，但仍然不知道为什么 < 不起作用。

我的 AngularJS： AngularJS v1.6.10

标签： ruby-on-railsangularjsangularjs-directiveangularjs-scope

解决方案

angular.module('app', [])
  .directive('myDirective', function() {
    return {
      scope: {
        param1: '@',
        param2: '<'
      },
      template: '<div><pre>param1= {{param1|json}}</pre><pre>param2= {{param2|json}}</pre></div>'
    };
  })
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.6.10/angular.js"></script>
<div ng-app="app" ng-init="scopeValue=[1,2,3]">
  <my-directive param1="string-value" param2="scopeValue"></my-directive>
</div>

@仅用于将插值作为字符串值传递。

<是一种从父级到子级的数据绑定方式，您可以使用它传递您想要的任何数据值。

推荐阅读