如何在AngularJs中将对象绑定到dom元素

比较猫

伙计们,我有一些简单的html,出于说明目的,它看起来像这样,

<div>{{class.name}}</div>
<div>
    <div>{{class.teacher.name}}</div>
    <div>{{class.teacher.age}}</div>
    <div>{{class.teacher.rating}}</div>
</div>

现在,如您所见,该模型具有一个类对象,该对象具有name属性和Teacher属性。我想做的是避免这段代码中的重复,以使我的绑定看起来更像这样。

<div>{{class.name}}</div>
<div some-directive-here="class.teacher">
    <div>{{name}}</div>
    <div>{{age}}</div>
    <div>{{rating}}</div>
</div>

angular是否支持一个指令,我可以在其中为dom元素创建新作用域,如上所示?我不想使用ng-controller,因为它会创建新的作用域并使我与原始模型数据断开连接。

伊兰·弗鲁默(Ilan Frumer)

这是一个小矮人:http ://plnkr.co/edit/MqesLIUA1kq1S7BLal3N?p=preview

一个简单的指令,它创建一个新的作用域并使用其父作用域的求值表达式对其进行扩展。

解决方案:

app.directive('newScope', function($parse){
  return {
    scope:true,
    compile: function (tElm,tAttrs){
      var fn = $parse(tAttrs.newScope);

      return function(scope, elm, attrs){
        var property = fn(scope.$parent);
        property = angular.isObject(property) ? property : {};
        angular.extend(scope, property);
      }      
    } 
  }
})

本文收集自互联网,转载请注明来源。

如有侵权,请联系[email protected] 删除。

编辑于
0

我来说两句

0条评论
登录后参与评论

相关文章

来自分类Dev

如何在AngularJs中将对象绑定到dom元素

来自分类Dev

如何在Winforms中将对象集合绑定到DataGridView

来自分类Dev

如何在Angularjs中将文本绑定为DOM对象

来自分类Dev

如何在Angularjs中将文本绑定为DOM对象

来自分类Dev

如何在AngularJs中将对象转换为对象数组?

来自分类Dev

在WPF中将对象绑定到DataTrigger

来自分类Dev

将对象绑定到元素的正确位置

来自分类Dev

如何在数据列表选择的选项ng-repeat中将对象绑定到ng-model

来自分类Dev

如何在angularjs中将对象值重置为null?

来自分类Dev

如何在angularjs中将对象推送到数组中?

来自分类Dev

如何在angularjs中将对象转换为数组

来自分类Dev

如何在angularjs中将对象从选择解析为整数?

来自分类Dev

如何在angularjs中将对象推送到数组?

来自分类Dev

如何在angularjs中将对象值重置为null?

来自分类Dev

如何将对象绑定到数组

来自分类Dev

如何在Java中将字符串绑定到对象

来自分类Dev

如何在WPF中将对象从一个窗口绑定到另一个窗口中的另一个控件?(C#)

来自分类Dev

Angular将对象元素绑定到HTML

来自分类Dev

如何在angularjs中将对象数据从一个控制器传递到另一个控制器

来自分类Dev

如何在Kotlin中将对象列表从活动A传递到活动B?

来自分类Dev

如何在Angular 2中将对象从“父级”组件传递到“子级”组件?

来自分类Dev

如何在 Meteor 和 React 中将对象从容器传递到类?

来自分类Dev

如何在angularjs中将对象显示为复杂的html表

来自分类Dev

将对象绑定到地图

来自分类Dev

将对象绑定到UserControl

来自分类Dev

将对象绑定到地图

来自分类Dev

如何在Silverlight中将子元素的宽度绑定到父元素的宽度

来自分类Dev

WPF:如何将对象绑定到组合框

来自分类Dev

如何将对象绑定到动态创建的标签?

Related 相关文章

  1. 1

    如何在AngularJs中将对象绑定到dom元素

  2. 2

    如何在Winforms中将对象集合绑定到DataGridView

  3. 3

    如何在Angularjs中将文本绑定为DOM对象

  4. 4

    如何在Angularjs中将文本绑定为DOM对象

  5. 5

    如何在AngularJs中将对象转换为对象数组?

  6. 6

    在WPF中将对象绑定到DataTrigger

  7. 7

    将对象绑定到元素的正确位置

  8. 8

    如何在数据列表选择的选项ng-repeat中将对象绑定到ng-model

  9. 9

    如何在angularjs中将对象值重置为null?

  10. 10

    如何在angularjs中将对象推送到数组中?

  11. 11

    如何在angularjs中将对象转换为数组

  12. 12

    如何在angularjs中将对象从选择解析为整数?

  13. 13

    如何在angularjs中将对象推送到数组?

  14. 14

    如何在angularjs中将对象值重置为null?

  15. 15

    如何将对象绑定到数组

  16. 16

    如何在Java中将字符串绑定到对象

  17. 17

    如何在WPF中将对象从一个窗口绑定到另一个窗口中的另一个控件?(C#)

  18. 18

    Angular将对象元素绑定到HTML

  19. 19

    如何在angularjs中将对象数据从一个控制器传递到另一个控制器

  20. 20

    如何在Kotlin中将对象列表从活动A传递到活动B?

  21. 21

    如何在Angular 2中将对象从“父级”组件传递到“子级”组件?

  22. 22

    如何在 Meteor 和 React 中将对象从容器传递到类?

  23. 23

    如何在angularjs中将对象显示为复杂的html表

  24. 24

    将对象绑定到地图

  25. 25

    将对象绑定到UserControl

  26. 26

    将对象绑定到地图

  27. 27

    如何在Silverlight中将子元素的宽度绑定到父元素的宽度

  28. 28

    WPF:如何将对象绑定到组合框

  29. 29

    如何将对象绑定到动态创建的标签?

热门标签

归档