2014-09-29 82 views
0

我是Angular.js的新手,我有一個textarea元素的問題。當我寫點東西時,我點擊添加此步驟按鈕,我放入文本區域的文本仍然存在,但我不知道爲什麼。問題與AngularJS textarea

HTML代碼:

<div class="form-group"> 
    <label for="stepAdd">Step</label> 
    <textarea class="form-control" rows="3" 
    id="stepAdd" placeholder="Describe the solution to solve the problem step by step" 
    ng-model="textStep" > 
</textarea> 
<a href="" class="btn btn-default" role="button" ng-click="addStep(textStep)">Add this step</a> 

角碼:

$scope.addStep = function(text) { 

    if(text === undefined) return; 

    var textFormat = text.trim(); 
    $scope.textStep = ''; 
    $scope.newDoc.steps.push({ 
     text: textFormat, 
     editing : false, 
     images : [] 
    }); 

    } 

回答

0

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

 
app.controller('firstCtrl', function($scope) { 
 
    //make sure that you define $scope.newDoc 
 
    $scope.newDoc = { 
 
    steps: [] 
 

 
    } 
 

 
    $scope.addStep = function(text) { 
 
    if (text === undefined) return; 
 
    var textFormat = text.trim(); 
 
    $scope.textStep = ''; 
 
    $scope.newDoc.steps.push({ 
 
     text: textFormat, 
 
     editing: false, 
 
     images: [] 
 
    }); 
 
    }; 
 

 
});
<link href="//maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css" rel="stylesheet" /> 
 
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> 
 

 
<body ng-app="app"> 
 
    <div ng-controller="firstCtrl"> 
 

 
    <div class="form-group"> 
 
     <label for="stepAdd">Step</label> 
 
     <textarea class="form-control" rows="3" id="stepAdd" placeholder="Describe the solution to solve the problem step by step" ng-model="textStep"></textarea> 
 
     <br/> 
 
     <a href="#" class="btn btn-default" role="button" ng-click="addStep(textStep)">Add this step</a> 
 

 

 
     <hr/> 
 
     <h3>newDoc:</h3> 
 
     <pre> {{newDoc | json}}</pre> 
 

 
    </div> 
 
</body>

+2

您可以添加可運行的代碼片斷?神奇 – 2014-09-29 19:36:21

+0

超級,它的工作原理,我只是在我的div上添加了ng-controller =「DocAddedCtrl」,但它很奇怪,因爲在它沒有ng-controller的情況下工作之前,通常這個控制器被定義在我的路由部分 – Alexis 2014-09-30 11:02:57