将范围存储在JSON中

时间:2016-05-18 00:50:38

标签: javascript angularjs json

我正在开发一个网络应用程序,根据用户关注的字段显示提示。我有一些不同的文本脚本,我想在这些不同的点上显示。

我想要做的是在显示这些字符串时显示范围数据。现在一切都呈现为文本。这就是我在做的事情。在视图中。 (忽略我对ng-init的不良使用,我会将其更改为控制器。)

    <div><p>Full Name</p><input placeholder="Name" name="personal.name" ng-model="personal.name" ng-model-options="{ updateOn: 'default blur' }" class="medium" type="text"/></div>
    <div><p>Address</p><input class="long" type="text" ng-model="personal.address" ng-model-options="{ updateOn: 'default blur' }" placeholder="Address"/></div>
    <div><p>Phone</p><input placeholder="Phone" ng-model="personal.phone" type="phone" ng-model-options="{ updateOn: 'default blur' }" only-digits/></div>

        <div ng-init="script()">
         <div ng-repeat="scripts in script">
          <div ng-show="{{scripts.element}}" ng-hide="true" class="alert-bar">
            <div class="wrapper">
              <div ng-bind="scripts.script"></div>
            </div>
          </div>
         </div>
        </div>

并且控制器再次忽略此中的数据我稍后会存储它。

    $scope.script = function(){

          $scope.script = [
            {
             'element': "personal.name",
             'script': '{{personal.name}} welcome to SOCU\'s loan application.'
            },
            {
             'element': "personal.address",
             'script':  '{{personal.name}}, please enter your full current address.'
            },
            {
             'element': "personal.phone",
             'script': '{{personal.name}}, please enter your current phone number, with the area code.'
            }
          ];
    }

一切正常,但我不能让名字显示出来。我知道我不应该在这里使用双花括号。我也尝试直接从$ scope获取数据,但我在那里看不到任何个人数据。

1 个答案:

答案 0 :(得分:0)

您无法在控制器中进行绑定,因为它们仅用于查看。

由于您迭代脚本数组,您只需访问对象的元素,

{{scripts.element + scripts.script}}

Handlebar语法应该适用于div元素。有一个如下所示的数组结构,

$scope.script = [{
    element: 'Person name',
    script: 'Your script'
}];

在你的div中,

<div ng-init="script()">
    <div ng-repeat="scripts in script">
        <div ng-show="{{scripts.element}}" ng-hide="true" class="alert-bar">
            <div class="wrapper">
                <div>
                    {{ scripts.element + " , " + scripts.script }}
                </div>
            </div>
        </div>
    </div>
</div>