如何将角度代码放在单独的文件中

时间:2015-09-05 15:38:50

标签: javascript angularjs

如果我把这个代码放在一个文件中,它可以很好地工作,但是当我分开时,不要只显示空白。在控制台我得到错误它找不到import Foundation class NamesShape { var numberofSides : Int = 0 var name : String init(name : String) { self.name = name } func simpleDescription() -> String{ return "the shape name is : \(name) " } } class Square : NamesShape { var sideLength : Double init(name : String , sideLength : Double) { self.sideLength = sideLength super.init(name: name) numberofSides = 4 } func area() -> Double{ return sideLength * sideLength } } class Triangle : NamesShape { var sideLength : Double init(name : String, sideLength : Double) { self.sideLength = sideLength super.init(name: name) numberofSides = 3 } } let square1 = Square(name : "square1" , sideLength : 10) print(square1.area()) print(square1.name)

以下是我如何区分:

app.js:

MainformCtrl

commentsController.js

angular.module('notifications',['yaru22.angular-timeago','ngRoute'], function($interpolateProvider) {
                $interpolateProvider.startSymbol('<%');
                $interpolateProvider.endSymbol('%>');


        });


    angular.module('commentsApp',['notifications']);
    angular.bootstrap(document.getElementById("comment"), ['commentsApp']);

routes.js

angular.module('commentsApp')
        .controller('CommentsCtrl',function($scope,$http,$routeParams){
              $scope.param = $routeParams.id;
              $http.get("/api/comments/"+ $scope.param)
              .success(function(data){
               var details = [];
               $.each(data,function(index,value){
                   if(value.user){
                    $.each(value.user,function(index1,value1){
                        var new_object = $.extend({}, value, value1);
                        details.push(new_object);

                    });
                   }
               });
               $scope.formShow = function(comm){
                   comm.formWhat = !comm.formWhat;
               };

               $scope.comments = details;
              })
              .error(function(data){
                  console.log(data);
              });
          })
          .controller('MainformCtrl',function($scope){
               $scope.fwhat = false;
               $scope.MainFormShow = function(){
                   $scope.fwhat = !$scope.fwhat;
               };       
          });

有人知道这里有什么问题吗?

3 个答案:

答案 0 :(得分:1)

问题是因为:模块bootsrap。要解决这个问题,我删除了这个:

angular.bootstrap(document.getElementById("comment"), ['commentsApp']);
来自app.js

并将其添加到控制器文件的末尾,因为它是最后一个文件。

@Grundy感谢您的帮助!

答案 1 :(得分:0)

我也遇到过这个问题。 :)

您只需要在主html文件中导入它们即可。不要忘记元素的顺序。以下是HTML的外观。

的index.html

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:id="@+id/root"
    android:layout_height="match_parent"
    android:orientation="vertical" >

    <Button
        android:id="@+id/launchmarket"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:onClick="dosome"
        android:text="launchmarket" />

    <Button
        android:id="@+id/launchmap"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:onClick="dosome"
        android:text="launchmap" />

</LinearLayout>

不要忘记在js文件之前导入angular.js。你的css文件应该放在文档的头部,任何Angular分离的模块应该在angular.js之后。要使用$ routeProvider,您需要导入ngRoute module,并且要使用此模块,您需要它的特定文件。您可以找到here或查看特定版本here

希望有所帮助。 :)

答案 2 :(得分:0)

您可以使用Browserify或Webpack之类的东西来使用CommonJS样式模块。