Question

这是我的观点

<div class="container" ng-controller="LunchCheckController">
  <h1>Lunch Checker</h1> 
      <div class="form-group" >
          <input id="lunch-menu" type="text"
              placeholder="list comma separated dishes you usually have for lunch"
              class="form-control" ng-model="input">
      </div>
      <div class="form-group">

      <button class="btn btn-default" ng-click="LunchCheckController()">
        Check If Too Much
      </button>
    </div>
    <div class="form-group message" id="result">
        <!-- Your message can go here. -->
        {{stack()}}
    </div>
</div>

这是我的JavaScript

(function() { 
    'use strict';

    angular.module('LunchCheck', [])
           .controller('LunchCheckController', LunchCheckController);

    LunchCheckController.$inject = ['$scope'];

    function LunchCheckController ($scope) {
        $scope.input = ""; //Taking input from the user
        $scope.stack = function(input) {
            var array = input.split(',');
            if (array.length < 3) {
                return "Enjoy";
            } else {
                return "You gotta Stop boy!";
            } // Splitting the input
        };
    }
})();

我是Angular.js的新手。我的目标是获得字符串并拆分它。拆分后，我想满足“如果物品数量超过3，打印享受”的情况，否则“其他”。

Answer 1

应该是这样的：

<div class="container" ng-controller="LunchCheckController">
  <h1>Lunch Checker</h1> 
      <div class="form-group" >
          <input id="lunch-menu" type="text"
              placeholder="list comma separated dishes you usually have for lunch"
              class="form-control" ng-model="input">
      </div>
      <div class="form-group">

      <button class="btn btn-default" ng-click="stack()">
        Check If Too Much
      </button>
    </div>
    <div class="form-group message" id="result">
        <!-- Your message can go here. -->
        {{message}}
    </div>
</div>

的JavaScript

(function() { 
    'use strict';

    angular.module('LunchCheck', [])
           .controller('LunchCheckController', LunchCheckController);

    LunchCheckController.$inject = ['$scope'];

    function LunchCheckController ($scope) {
        $scope.input = "";
        $scope.message = "";
        $scope.stack = function() {
            // already can access $scope.input
            // dont need to pass to stack()
            var array = $scope.input.split(',');

            // set $scope.message
            // instead of returning String
            if (array.length < 3) {
                $scope.message = "Enjoy";
            } else {
                $scope.message = "You gotta Stop boy!";
            }
        };
    }
})();

考虑数据如何流动：

将文本框绑定到输入
点击按钮运行功能
检查字数
设置消息

学习Angular.js

首先要看的是他们网站上的Angular教程。

https://docs.angularjs.org/tutorial

我一开始并没有发现它们有用，但它们是最好的起点。

如果您的新角色在几小时内从0到英雄，则必须播放此视频：

50个示例中的Angular.js简介

https://www.youtube.com/watch?v=TRrL5j3MIvo

然后我建议通过 Misko Hevery 观看一些YouTube视频，他在谷歌发明了角度，并解释得非常好。

此播放列表是一个很好的起点。

https://www.youtube.com/watch?v=k4qVkWh1EAo&list=PL53194065BA276ACA

他解释了最佳功能以及人们常常陷入困境的地方。

Answer 2

您需要将input变量传递到视图中的堆栈函数，例如{{stack(input)}}

或使用var array = $scope.input.split(',');代替var array = input.split(',');

Answer 3

var str = "How are you doing today?";
var res = str.split(" ");

这是基本的javascript拆分功能。

使用angular，您需要将输入框设为ng-model，让我们说str1。

您需要做的就是

var res = $scope.str1.split(" ");

现在很简单..检查res.length并完成任务。

如何在Angular.js中拆分字符串？

3 个答案: