簡體   English   中英

將輸入文本發送到AngularJS中的控制器作用域

[英]Send input text to controller's scope in AngularJS

我有這個html頁面:

<div class="rtm-nav">
    <div ng-app>
    <body ng-controller="DemandCtrl" ng-submit="submit()">
        <label>From:
            <input type="text" name="input" ng-model="ctrl.dataa.from">
        </label>
        <label>To:
            <input type="text" name="input" ng-model="ctrl.dataa.to">
        </label>
        <input type="submit" id="submit" value="Apply" />

        <script src="demand/demand.js"></script>
    </body> 
    </div>
</div>

我想從控制器范圍的2個文本框中保存輸入文本。 這是我嘗試執行的操作:

class DemandCtrl {
    constructor(ChartDataService) {
        this.ChartDataService = ChartDataService;
        debugger;
        this.dataa = {
            from: ctrl.dataa.from,
            to: ctrl.dataa.to
        };
    }

    $onInit() {
        getData.call(null, this);       
    }

}

我收到錯誤消息:

ReferenceError:ctrl.dataa未定義

有沒有更好的方法將數據從輸入文本發送到控制器?

您尚未定義控制器接受的范圍。 這就是為什么您無法從表單讀取數據的原因。 我還建議使用<form>處理任何類型的數據提交。 因此,請看一下您的重構示例:

==== HTML ======

    <div class="rtm-nav">
        <div ng-app="my-app">
          <form ng-submit="submit()" ng-controller="DemandCtrl">
            <label>From:
                <input type="text" name="input" ng-model="ctrl.data.from">
            </label>
            <label>To:
                <input type="text" name="input" ng-model="ctrl.data.to">
            </label>
            <input type="submit" id="submit" value="Apply" />
          </form>

        </div>
    </div>

=====控制器

    angular.module('my-app', [])
       .controller('DemandCtrl', function($scope) {
            $scope.submit = function() {
                let data = {
                    from: $scope.ctrl.data.from,
                    to: $scope.ctrl.data.to,
                }
               console.log(data);
            };
    });

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM