如何从弹出的数值在angularjs父视图? [英] How to retrieve the values from popup to parent view in angularjs?

查看:112
本文介绍了如何从弹出的数值在angularjs父视图?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我有上popup..I动态创建输入框的弹出想要的是父view.The文本框文本框来显示动态内容1,2,3等都有一个id on.If我想在父视图中显示它,我需要循环它。但是如何在这些文本框的文本分配给一个变​​量,并查看父屏幕上。

  // popuphtmlfile
    < H3风格=COLOR:#0d7dc1;>选择文本框< / H3 GT&;
        < BR>
            < UL>
                <李NG重复=文本框的文本框>
                    标签Inputfield:
                        <输入类型=文本ID =,在_ {{$指数}}/><按钮类=BTN BTN-SM BTN-默认的NG点击=deletetxtbox()> - < /按钮>
                < /李>
                <立GT;
                    <按钮类=BTN BTN-默认的NG点击=expndtxt()>点击添加文本框< /按钮>
                < /李>
          < / UL>
        <按钮式=提交级=BTN BTN默认右拉式NG点击=savebutton()>保存< /按钮>
        <按钮类=BTN BTN-默认的NG点击=cancl()>取消< /按钮>// js文件//为按钮单击文本框追加
$ scope.expndtxt =功能(){
        $ scope.textboxes.push({
        });
    };//删除,如果我们没有需要在弹出的文本框的任何
    $ scope.deletetxtbox =功能(指数){         $ scope.textboxes.splice(指数,1);
    };//如果保存按钮后,当我必须我添加到父视图标签与文本框再输入文本框anythnng。
    $ scope.savebutton =功能(){        angular.forEach($ scope.textboxes,功能(T)
                {                    //文本框的内容必须显示为标签名称与一个新的文本框
                });    };


解决方案

您可以绑定NG-改变指令和文本时更改您可以将它保存每一个文本框它对应的文本框的对象,在那里你可以稍后itterate的价值。

  // popuphtmlfile
    < H3风格=COLOR:#0d7dc1;>选择文本框< / H3 GT&;
        < BR>
            < UL>
                <李NG重复=文本框的文本框>
                    标签Inputfield:
                        <输入类型=文本ID =,在_ {{$指数}}NG模型=textBoxModel [$指数]NG-变化=的onChange(textBoxModel [$指数])/>
                        <按钮类=BTN BTN-SM BTN-默认的NG点击=deletetxtbox()> - < /按钮>
                < /李>
                <立GT;
                    <按钮类=BTN BTN-默认的NG点击=expndtxt()>点击添加文本框< /按钮>
                < /李>
          < / UL>
        <按钮式=提交级=BTN BTN默认右拉式NG点击=savebutton()>保存< /按钮>
        <按钮类=BTN BTN-默认的NG点击=cancl()>取消< /按钮>// js文件//为按钮单击文本框追加
$ scope.expndtxt =功能(){
        $ scope.textboxes.push({
        });
    };//删除,如果我们没有需要在弹出的文本框的任何
    $ scope.deletetxtbox =功能(指数){         $ scope.textboxes.splice(指数,1);
    };//如果保存按钮后,当我必须我添加到父视图标签与文本框再输入文本框anythnng。
    $ scope.savebutton =功能(){        angular.forEach($ scope.textboxes,功能(T)
                {                    //文本框的内容必须显示为标签名称与一个新的文本框
                    //这里你可以得到每一个文本框文本属性
                    t.text;
                });    };//的onChange函数,它会从文本框的所有文本,并将其存储到它的correspondive对象$ scope.textBoxOnChange =功能(textboxmodel,texboxobject){
    texboxobject.text = textboxmodel;
};

I have a popup which creates input boxes dynamically on popup..I want to display the content of that textboxes on the parent view.The textboxes has an id dynamically as 1,2,3 and so on.If i want to display it in parent view i need to loop it.But how to assign those text in the textboxes to a variable and view it on parent screen.

    //popuphtmlfile


    <h3 style="color: #0d7dc1;">Selection Of TextBoxes</h3>
        <br>
            <ul>
                <li ng-repeat="textbox in textboxes">
                    Label For Inputfield:
                        <input type="text" id="in_{{$index}}"/><button class="btn btn-sm btn-default" ng-click="deletetxtbox()">-</button>
                </li>
                <li>
                    <button class="btn btn-default" ng-click="expndtxt()">Click to add textboxes</button>
                </li>
          </ul>
        <button type="submit"  class="btn btn-default pull-right" ng-click="savebutton()">Save</button>
        <button class="btn btn-default" ng-click="cancl()">Cancel</button>

//js file

//for appending textboxes on button click
$scope.expndtxt=function(){


        $scope.textboxes.push({
        });
    };

//deleting if we no need any textbox on the popup
    $scope.deletetxtbox=function(index){

         $scope.textboxes.splice(index, 1);
    };

//if save button is clicked ,when i enter anythnng in the textboxes that must me added to the parent view as a label with a textbox again.


    $scope.savebutton=function(){

        angular.forEach($scope.textboxes,function(t)
                {

                    //The content of text box must be displayed as label name with a new text box
                });

    };

解决方案

You can bind ng-change directive and on each textbox when text is changed you can save it's value to it's corresponding textbox object, where you can itterate later.

  //popuphtmlfile


    <h3 style="color: #0d7dc1;">Selection Of TextBoxes</h3>
        <br>
            <ul>
                <li ng-repeat="textbox in textboxes">
                    Label For Inputfield:
                        <input type="text" id="in_{{$index}}" ng-model="textBoxModel[$index]" ng-change="onChange(textBoxModel[$index])"/>
                        <button class="btn btn-sm btn-default" ng-click="deletetxtbox()">-</button>
                </li>
                <li>
                    <button class="btn btn-default" ng-click="expndtxt()">Click to add textboxes</button>
                </li>
          </ul>
        <button type="submit"  class="btn btn-default pull-right" ng-click="savebutton()">Save</button>
        <button class="btn btn-default" ng-click="cancl()">Cancel</button>

//js file

//for appending textboxes on button click
$scope.expndtxt=function(){


        $scope.textboxes.push({
        });
    };

//deleting if we no need any textbox on the popup
    $scope.deletetxtbox=function(index){

         $scope.textboxes.splice(index, 1);
    };

//if save button is clicked ,when i enter anythnng in the textboxes that must me added to the parent view as a label with a textbox again.


    $scope.savebutton=function(){

        angular.forEach($scope.textboxes,function(t)
                {

                    //The content of text box must be displayed as label name with a new text box
                    //here you can get each textbox text attribute
                    t.text;
                });

    };

//onChange function which will get all text from text-boxes and store it to it's correspondive object

$scope.textBoxOnChange = function(textboxmodel,texboxobject){
    texboxobject.text = textboxmodel;
};

这篇关于如何从弹出的数值在angularjs父视图?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆