将json值作为ng-model值传递到角度1.2

时间:2016-08-26 14:19:36

标签: javascript angularjs json angularjs-directive

我试图绑定2个单独的元素,以便可以触发另一个元素。第一步是向我的组件模板添加一个标识变量。 这是bullet.html模板:

<div class="button bullet" ng-model="component.bullet.show_on_click" ng-click="showElementByUniqueName( component.bullet.show_on_click )"><p>{{component.bullet.text}}</p></div>

我想知道将component-model设置为component.bullet.show_on_click中的VALUE的正确语法是什么。目前,在最终的html中,ng-model的结果正如模板中所示。我试过单个语音标记和单个和双花括号;所有抛出错误。

任何帮助,非常感谢!

修改

根据要求,这里有一些更详细的信息:

eng-bullet属性会激活engBullet指令:

app.directive('engBullet', function() {
        return {
            restrict: 'A',
            replace: true,
            templateUrl: 'components/bullet.html',
            link: function(scope, element, attrs) {

                // following function referenced in bullet.html
                scope.showElementByUniqueName = function (showOnClick) {

                    // remove 'replaces' element
                    $('#'+$('#'+showOnClick).attr('data-replaces')).addClass('hidden');

                    // hide all popups (in case another popup is currently visible)
                    $('.popup').addClass("hidden");

                    // show selected popup
                    $('#'+showOnClick).removeClass("hidden");
                }
            }
        };
    });

eng-popup属性会激活engPopup指令:

app.directive('engPopup', function() {
        return {
            restrict: 'A',
            replace: true,
            templateUrl: 'components/popup.html',
            link: function(scope, element, attrs) {
                scope.show = true;
                scope.complete = false;
                // watch for this popup being made visible and check if
                scope.$watch(function() { return element.is(':visible') }, function() {
                    scope.$parent.componentCompleted(attrs.id);
                });

            }
        };
    });

..在components / popup.html模板中加载:

<div class="hidden popup {{component.popup.type}}" id="{{component.popup.name}}" data-replaces="{{component.popup.replaces}}" eng-completable ng-show="component.popup.name">
    <div ng-if="component.popup.type=='overlay'">
        <div class="float-right button close-button">X</div>
    </div>
    <p class="heading">{{component.popup.heading}}</p>
    <div class="popup-content">
        <div ng-if="0" ng-repeat-start="(innerIndex, component) in component.popup.popup_components"></div>
            <div ng-if="0" ng-repeat-start="(type, object) in component"></div>
                <div ng-attr-id="{{'p' + pageId + '-s' + skey + '-c' + ckey + '-component-' + index + '-innerComponent-' + innerIndex}}" ng-switch="type">
                    <div ng-switch-when="image" eng-image></div>
                    <div ng-switch-when="paragraph" eng-paragraph></div>
                </div>
            <div ng-if="0" ng-repeat-end></div>
        <div ng-if="0" ng-repeat-end></div>
    </div>
</div>

我不确定这与问题是否真的相关,这是如何在component.bullet.show_on_click中获取VALUE以在最终的html中显示为bullet html中ng-model的值模板,例如:

ng-model="unique_name_here"


感谢。

0 个答案:

没有答案