속성 창이 생성되는 위치는 원하는 객체에 따라 달라질 수 있습니다. 그것은AngularJS 지시문 속성의 문자열이 아닌 유형
<div ng-app="MyApp">
<div class="properties-pane" ng-controller="PropertiesPane">
<div ng-repeat="property in properties">
<property name="{{property.name}}" value="{{property.value}}">
</div>
</div>
</div>
간단하지 않다 :
가 나는 같은 코드를 사용하여 이름과 속성 값을 표시 property
라는 자신의 지시에 의해 만들었습니다? 이것은 property.value
이 문자열로 변환된다는 점을 제외하고는 잘 작동합니다 (DOM 요소의 속성이므로). 속성 값이 다른 데이터 형식 인 경우 어떻게해야합니까? 예를 들어 객체. (커피 스크립트에서) 구현의 나머지 부분을 참조 :
첫째,
둘째 : value.x로서
MyApp = angular.module('MyApp', [])
MyApp.controller 'PropertiesPane', ($scope) ->
$scope.properties = [
# Note that value is an object, not a string:
{name: 'First', value: {x:0, y:0, z:42}},
{name: 'Second', value: {x:0, y:20, z:0}},
{name: 'Third', value: {x:1, y:1, z:1}},
]
MyApp.directive 'property', ($compile) ->
restrict: 'E'
transclude: false
replace: true
scope: {name: '@name', value: '@value'}
template: '<div>{{name}} {{value.x}}, {{value.y}}, {{value.z}}</div>'
# ^^^^^^^ ^^^^^^^ ^^^^^^^
# this doesn't work as value is a string, not an object
를, Y 및 Z는 문자열에 정의되어, 그 결과는 물론이고
셋째,
I 원하는 출력은 :
먼저 0, 0, 42
제 0, 20, 0,321 0 셋째 1, 1,
요소를 프로그래밍 방식으로 추가하는 방법에 근본적으로 잘못된 생각이 있습니다. 이와 비슷한 것을 구현하는 각도 방식은 무엇입니까?
편집 : 솔루션
는 참조 대신 문자열 값으로 개체로 value
을 참조 지시어에 =
대신 @
을 사용하려면
scope: {name: '@', value: '='}
그리고 템플릿 :
<property name="{{property.name}}" value="property.value">
{{}}
.
감사합니다! 그랬어! –
이것은 때때로 바람직하지 않은 효과 인 해당 지시문에 대해 격리 된 범위를 만듭니다. – Uri
나는 당신이 의미 생각 : 범위 : {이름을 '@'값 '= 이름'} 이것은 '값'해시 –