如何清除其他View一个View的输入值？ [英] How to clear one View's Input value from other View?

问题描述

我的情况是如此的简单和直接的。但我没能得到确切的输出。

在我的情况，我有命名为：index.htm的，加上/main.htm并命名为mscript.js一个脚本页面两个HTML页面。 index.htm的由一个按钮（清除）和main.htm中包含一个输入字段类型为文本。

我要的是：

在单击（从索引视图）按钮，在输入类型字段中的用户（从主视图）输入的文本已被清除。

我的尝试是

我已经使用配置块。

的index.htm：

 ＆LT; D​​IV数据-NG-应用=mangular＆GT;
    ＆LT; D​​IV数据-NG-控制器=mcontroller＆GT;严格用于演示目的
        ＆LT; BR /＆GT;
        ＆LT; BR /＆GT;
        ＆LT; BR /＆GT;
        ＆LT; D​​IV数据-NG-视图=＆GT;＆LT; / DIV＆GT;
        ＆LT; BR /＆GT;
        ＆LT;按钮式=提交数据-NG-点击=清除（）＆GT;清除＆LT; /按钮＆GT;
    ＆LT; / DIV＆GT;
＆LT; / DIV＆GT;
 

main.htm中

 ＆LT; D​​IV＆GT;
  输入您的姓名：
  ＆LT;输入类型=文本数据-NG-模式=demotext/＆GT;
＆LT; / DIV＆GT;
 

mscript.js

  VAR mangular = angular.module（'mangular'，['ngRoute']）;mangular.config（函数（$ routeProvider）{
    $ routeProvider.when（'/'，{
        templateUrl：main.htm中
    }）
}）;mangular.controller（'mcontroller'，函数（$范围）{    // VAR测试= mfactory.getinput（）;
    $ scope.clear =功能（）{
        $ scope.demotext =; //这是我期待的解决方案的地方
    }
}）;
 

解决方案

试试这个：的http：// jsfiddle.net/sherali/Mh2UH/31/

但是，
- 我加控制器`$ routeProvider。

• 而且里面，我加了 $范围。$看。

然后它

  VAR对myApp =角
    .module（'对myApp'，['ngRoute']）
    的.config（函数（$ routeProvider）{
        $ routeProvider
            。什么时候（'/'， {
                模板：'＆LT;输入您的姓名; DIV＆GT：其中;输入类型=文本NG模型=TEXT/＆GT;＆LT; / DIV＆GT;，
                控制器：'viewCtrl
            }）
            。除此以外（{
                redirectTo：'/'
            }）;
    }）
 

...

  myApp.factory（'aProvider'，函数（）{
    返回{
        文字：默认文本
    }
}）;
 

...

  myApp.controller（'myCtrl'，函数（$范围，aProvider）{
    $ scope.clear =功能（）{
        aProvider.text =;
    }
}）;myApp.controller（'viewCtrl'，函数（$范围，aProvider）{
    $范围。$表（函数（）{
        返回aProvider.text;
    }，功能（VAL）{
        $ scope.text = VAL;
    }）    $范围。$腕表（'文字'，函数（VAL）{
        aProvider.text = VAL;
    }）
}）;
 

My scenario is so simple and straight forward. But I'm failing to get the exact output.

In my case, I'm having two html page named as, Index.htm, Main.htm and One script page named as mscript.js. Index.htm consists of one button (Clear) and Main.htm consists of one input type field as text.

What I want is:

On clicking of button(from Index view), the text entered by the user in the input type field(from Main view) has to be cleared.

What i tried is

I have used configuration block.

Index.htm:

<div data-ng-app="mangular">
    <div data-ng-controller="mcontroller">Strictly for Demo Purpose
        <br />
        <br />
        <br />
        <div data-ng-view=""></div>
        <br />
        <button type="submit" data-ng-click="clear()">Clear</button>
    </div>
</div>

Main.htm

<div>
  Type your Name : 
  <input type = "text" data-ng-model = "demotext" />
</div>

mscript.js

 var mangular = angular.module('mangular', ['ngRoute']);

mangular.config(function ($routeProvider) {
    $routeProvider.when('/', {
        templateUrl: 'Main.htm'
    })
});

mangular.controller('mcontroller', function ($scope) {

    //var test = mfactory.getinput();
    $scope.clear = function () {
        $scope.demotext = ""; // This is the place where I'm expecting solution
    }
});

解决方案

Try this: http://jsfiddle.net/sherali/Mh2UH/31/

But, - I added controller to `$routeProvider.

• And inside, I added $scope.$watch.

then it works

var myApp = angular
    .module('myApp', ['ngRoute'])
    .config(function ($routeProvider) {
        $routeProvider
            .when('/', {
                template: '<div>Type your Name : <input type = "text" ng-model = "text" /></div>',
                controller: 'viewCtrl'
            })
            .otherwise({
                redirectTo: '/'
            });
    })

...

myApp.factory('aProvider', function () {
    return {
        text: "default Text"
    }
});

...

myApp.controller('myCtrl', function ($scope, aProvider) {
    $scope.clear = function () {
        aProvider.text = "";
    }
});

myApp.controller('viewCtrl', function ($scope, aProvider) {
    $scope.$watch(function () {
        return aProvider.text;
    }, function (val) {
        $scope.text = val;
    })

    $scope.$watch('text', function (val) {
        aProvider.text = val;
    })
});

这篇关于如何清除其他View一个View的输入值？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！