Question

我是AngularJS的新手。我试图用JavaScript找到页面上的中心点，然后将其绑定到$ scope对象。我不完全确定我是否正确绑定了JavaScript变量。在我这样做之后，我试图在HTML页面中预览值。当我运行代码时，它会抛出一条错误消息。

＆＃13;

<script type="text/javascript">
    var Page_Center_Width = $(window).width() / 2;
    var Page_Center_Height = $(window).height() / 2;
</script>

<script>
      var app = angular.module('myApp', []);
      app.controller('mainCtrl', function ($scope, $interval, $window) {
            $scope.Window_Width =  $window.Page_Center_Width;
            $scope.Window_Height = $window.Page_Center_Height;
      });
</script>

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.4/angular.min.js"></script>

<div ng-app="myApp" ng-controller="mainCtrl" >
    <div >Window-Width: {{Window_Width}}</div>
    <div >Window-Height: {{Window_Height}}</div>
</div>

＆＃13;

Answer 1

var Page_Center_Width = $(window).width() / 2;
var Page_Center_Height = $(window).height() / 2;
var app = angular.module('myApp', []);
app.controller('mainCtrl', function ($scope, $interval, $window) {
    $scope.Window_Width = $window.Page_Center_Width;
    $scope.Window_Height = $window.Page_Center_Height;
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.4/angular.min.js"></script>

<div ng-app="myApp" ng-controller="mainCtrl">
    <div>Window-Width: {{Window_Width}}</div>
    <div>Window-Height: {{Window_Height}}</div>
</div>

Answer 2

您的代码段有不同的问题。你把脚本标记放在javascript部分。

var app = angular.module('myApp', []);
app.controller('mainCtrl', function($scope, $interval, $window) {
  $scope.Window_Width = $window.Page_Center_Width;
  $scope.Window_Height = $window.Page_Center_Height;
});

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.4/angular.min.js"></script>

<div ng-app="myApp" ng-controller="mainCtrl">
  <div>Window-Width: {{Window_Width}}</div>
  <div>Window-Height: {{Window_Height}}</div>
</div>
<script type="text/javascript">
  var Page_Center_Width = 3434;
  var Page_Center_Height = 1222;
</script>

将JavaScript变量分配给AngularJS Scope对象并显示它

2 个答案: