在 JSFiddle 中,我使用标准语法创建了一个圆弧,它创建了一个又长又瘦的省略号。我发现我应用的 css 决定了它的尺寸而不是画布。为什么是这样?
JSFiddle: https: //jsfiddle.net/jey2fodj/2/
HTML:
<div id='drawSpace'></div>
Run Code Online (Sandbox Code Playgroud)
CSS:
.circle {
height: 100px;
width: 100px;
border: 1px solid black;
}
Run Code Online (Sandbox Code Playgroud)
JavaScript:
var c = document.createElement('canvas');
c.className = 'circle';
var ctx = c.getContext("2d");
ctx.beginPath();
ctx.arc(50,50,50,0,3*Math.PI);
ctx.stroke();
document.getElementById('drawSpace').appendChild(c);
Run Code Online (Sandbox Code Playgroud)
继续更改样式的宽度/高度以帮助理解问题。谢谢。
我有一个角度控制器,使用$ http.get()方法获取数据.我将响应数据分配给$ scope.foo和$ scope.bar.
然后我使用ng-model ="foo"将$ scope.foo绑定到输入字段,然后使用ng-click ="buttonClick()"将$ scope函数$ scope.buttonClick绑定到一个按钮.
当我更改输入字段的值并选择按钮时,$ scope.buttonClick同时输出$ scope.foo和$ scope.bar,它们似乎与新输入的值匹配.这很奇怪,因为我只绑定了$ scope.foo.为什么会发生这种情况,我该如何解决?
控制器:
angular.module('app')
.controller('controller', ($scope, $http) => {
$document.ready(() => {
$http.get('/data').then((res) => {
$scope.foo = res.data;
$scope.bar = res.data;
});
$scope.buttonClick = () => console.log($scope.foo, $scope.bar);
});
});
Run Code Online (Sandbox Code Playgroud)
(使用ES6语法) https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Functions/Arrow_functions