在提交按钮上显示来自textarea的文本 - Angular JS

时间:2015-05-14 10:59:13

标签: javascript jquery html angularjs

问]我是基础开发者,如何使用angular-js在提交按钮上显示textarea中的文本?

我现在有代码: -

<html ng-app="myApp">

<head>
    <script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.2.26/angular.min.js"></script>
    <script>
    myApp = angular.module('myApp', []);

    function Ctrl($scope) {
        $scope.list = [];
        $scope.pass = $scope.list;
        $scope.text = 'Share your knowledge !';
        $scope.submit = function() {
            if ($scope.text) {
                $scope.pass.push($scope.text);
            }
        };
    }
    </script>
</head>

<body>
    <div ng-app>
        <div ng-controller="Ctrl">
            <form ng-submit="submit()">
                <br>
                <textarea style="resize:initial;" type="" ng-model="text" name="text"></textarea>
                <br>
                <input align="right" style="margin-top:20px;margin-left:120px; align:right;" type="submit" id="submit" value="Submit" />
                <pre>{{list}}</pre>

            </form>
        </div>
    </div>
</body>

</html>

上面的代码只是以数组格式显示来自textarea的消息。

但我只想要打印/显示单个短信。怎么能实现呢?谢谢。

2 个答案:

答案 0 :(得分:0)

您可以将text用作textarea的值。 提交from时,设置textarea的值。

我想你希望textarea中的消息在表单提交后显示在list中。

<html ng-app="myApp">

<head>
    <script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.2.26/angular.min.js"></script>
    <script>
    myApp = angular.module('myApp', []);

    function Ctrl($scope) {
        $scope.list = '';
        // ^^^^^^^^^^^^^

        $scope.pass = $scope.list;
        $scope.text = 'Share your knowledge !';

        $scope.submit = function() {
            $scope.list = $scope.text;
            // ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
        };
    }
    </script>
</head>

<body>
    <div>
        <div ng-controller="Ctrl">
            <form ng-submit="submit()">
                <br>
                <textarea style="resize:initial;" type="" ng-model="text" name="text"></textarea>
                <br>
                <input align="right" style="margin-top:20px;margin-left:120px; align:right;" type="submit" id="submit" value="Submit" />
                <pre>{{list}}</pre>
            </form>
        </div>
    </div>
</body>

</html>

答案 1 :(得分:0)

我猜你只想显示textarea中的当前消息。如果是这样的话:

    function Ctrl($scope) {
        $scope.pass = [];
        $scope.text = 'Share your knowledge !';
        $scope.submit = function() {
            if ($scope.text) {
                $scope.pass.push($scope.text);
                $scope.list = $scope.text;
            }
        };
    }