Question

我想开始说我不熟悉我正在使用的技术，我正在做这个项目来练习使用它们。

我刚刚下载了JetBrains Webstorm并创建了Foundation Project。

我创建了一个<textarea>，我想将它绑定到我在AngularJS控制器中定义的值。控制器代码非常简单（它在我的main.js文件中）：

var readerApp = angular.module("readerApp", []);

function ReaderCtrl = function($scope){
    $scope.data = {
        text = "Default text"
    }
}

所以我只有一个我想要绑定的简单文本：ng-model="{{data.text}}"

虽然当我这样做时，<textarea>仍然没有显示任何内容。我会发布整个HTML页面，也许有一个我缺少的小细节，但它似乎对我来说

<!doctype html>
<html class="no-js" lang="en" ng-app="readerApp">
  <head>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Speed Reader | Welcome</title>
    <link rel="stylesheet" href="css/foundation.css" />
    <script src="js/vendor/modernizr.js"></script>
  </head>
  <body>
  <div>
    <div class="row">
      <div class="large-12 columns large-text-center">
        <h1>Welcome to Speed Reader!</h1>
      </div>
    </div>

    <div class="row">
      <div class="large-12 columns">
        <div class="panel" ng-controller="ReaderCtrl">
            <h3>Insert your text here! </h3>

            <textarea id="textarea" rows="25" ng-model="{{data.text}}"></textarea>

            <a href="#" class="medium success button right">Start reading</a>
            <div class="clearfix"></div>
        </div>
      </div>
    </div>
  </div>

  <script src="js/vendor/jquery.js"></script>
  <script src="js/foundation.min.js"></script>
  <script src="js/angular/angular.min.js"></script>
  <script src="js/main.js"></script>
  <script>
  $(document).foundation();
  </script>
  </body>
</html>

无法使用AngularJS设置textarea值

0 个答案: