我正在学习angular.js,并想知道什么时候app.controller("MyCtrl",...)
应该使用以及什么时候function MyCtrl($scope){...}
应该使用.
我看到这个例子中两种方法之间没有太大的区别(链接到一个plunker):
index.html:
<body ng-app="myApp">
<div ng-controller="FirstCtrl as app1">
<button class="btn" ng-model="app1.count"
ng-click="app1.increment()">
Click to increment</button>
{{ app1.count }}
</div>
<div ng-controller="SecondCtrl">
<button class="btn" ng-model="count"
ng-click="increment()">
Click to increment</button>
{{ count }}
</div>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.0-rc.2/angular.js"></script>
<script type="text/javascript" src="example.js"></script>
</body>
Run Code Online (Sandbox Code Playgroud)
example.js:
var app = angular.module("myApp", []);
app.controller("FirstCtrl",function () {
this.count = 0;
this.increment = function (){
this.count = this.count + 1;
}
});
function SecondCtrl($scope){
$scope.count = 0;
$scope.increment = function …
Run Code Online (Sandbox Code Playgroud) 我正在创建一个单页面应用程序,我对骨干很新.我在创建使用相同wrapper-div的多个视图时遇到问题.
我的设置:
我为所有视图添加了一个close函数:
Backbone.View.prototype.close = function(){
this.remove();
this.off();
if (this.onClose){
this.onClose();
}
}
Run Code Online (Sandbox Code Playgroud)
我有一个wrapper-div,我想渲染视图,删除它们并渲染新的视图.所以我的SetupView看起来像这样:
app.SetupView = Backbone.View.extend({
el: '#my_view_wrapper',
...
});
Run Code Online (Sandbox Code Playgroud)
从我交换视图的函数我关闭当前(打开)视图,如下所示:
var v = this.model.get('view');
v.close();
Run Code Online (Sandbox Code Playgroud)
题
我的问题是我有多个视图使用相同的wrapper-div.但是当我关闭一个视图时,这个wrapper-div似乎被删除了,我尝试创建的下一个视图找不到这个div.
我想有一个简单的解决方案?我想重用相同的包装器,只删除其中的视图,而不是包装器本身.
我在我的应用程序中使用angular-translate.如果determinePreferredLanguage()
返回我的代码不知道的语言密钥,如何注册后备语言?
如果瑞典的某个人访问我的网站(语言密钥:sv),我想回到英语.但由于我没有在我的函数中列出svregisterAvailableLanguageKeys
,它失败了,语言键显示给用户而不是翻译.
$translateProvider
.registerAvailableLanguageKeys(['da-dk','en-us'], {
'en_US': 'en-us',
'en_UK': 'en-us',
'da': 'da-dk',
})
.determinePreferredLanguage();
Run Code Online (Sandbox Code Playgroud) 测试svg绘制的两个形状path
是否相交,有什么好方法(代码方面和性能方面)?我在d3中这样做,并使用"基数闭合" 线插值
更具体地说,我正在创建凸包(比图像中更复杂),如果它们重叠,我想合并外壳.如果我使用"线性闭合"插值很容易,因为那时我可以使用顶点来计算交点,但"基数闭合"插值在我使用它的地方看起来更好.
var v1 = [[100,100],[200,100],[200,200],[100,200]],
v2 = [[210,100],[310,100],[310,200],[210,200]];
var hull1 = d3.geom.hull(v1),
hull2 = d3.geom.hull(v2);
var svg = d3.select("#foo")
.append("svg");
var line = d3.svg.line()
.interpolate("cardinal-closed")
.x(function(d) {return d[0];})
.y(function(d) {return d[1];});
svg.append("path")
.attr("d", line(hull1));
svg.append("path")
.attr("d", line(hull2));
Run Code Online (Sandbox Code Playgroud)
这是一个jsfiddle.如何测试这些形状是否相交/重叠?
我clipPath
在AngularJS项目中使用了svg .我在为clipPath指定相对url时遇到问题,因为我需要<base>
在项目中使用该元素.
例如,此代码可以在项目中使用base
,但不能在项目中使用<base href="/">
<svg width="120" height="120"
viewPort="0 0 120 120" version="1.1"
xmlns="http://www.w3.org/2000/svg">
<defs>
<clipPath id="myClip">
<rect x="10" y="10" width="60" height="60"></rect>
</clipPath>
</defs>
<g clip-path="url(#myClip)">
<circle cx="30" cy="30" r="20"/>
<circle cx="70" cy="70" r="20"/>
</g>
</svg>
Run Code Online (Sandbox Code Playgroud)
怎么解决这个问题?我使用ui-router,如果这与问题有关...
这个问题大致相同,但OP找到的"解决方案"是删除基础,这在我的情况下不是解决方案.
我在d3.js中创建了一个svg xy-chart.是否可以根据tickValue创建不同长度的刻度?
我已经制作了自己的tickFormat函数myTickFormat
并使用它.tickFormat([format])
并且工作正常,因为[format]应该是一个函数.但这是不可能做同样的.innerTickSize([size])
,期望一个数字.
例如,如果我希望值70的刻度更长,我想做这样的事情:
var myTickSize = function(d) {
if (d === 70) { return 20;}
return 6;
};
Run Code Online (Sandbox Code Playgroud)
但当我myTickSize
用作参数时.innerTickSize()
:
var yScale = d3.scale.linear();
var yAxis = d3.svg.axis()
.scale(yScale).orient("left")
.innerTickSize(myTickSize);
Run Code Online (Sandbox Code Playgroud)
我收到错误:每个tick的属性x2 ="NaN"错误的值无效.
我和foreignObject
SVG 一起讨厌.我想在一个内部添加文本rect
,并获得自动文本换行我选择使用HTML.foreignObject
可以在这里找到描述.
我正在使用D3,这是我的数据:
var cds = [
{"uid":"U12","sid":"16","statement":"Movies","x":10,"y":10},
{"uid":"U20","sid":"17","statement":"Food","x":10,"y":170},
{"uid":"U22","sid":"15","statement":"Sport","x":10,"y":330}
];
Run Code Online (Sandbox Code Playgroud)
我为每个数据添加一张卡片,并希望显示数据中的"语句".
var cardsize = { width : 150, height : 150 };
var svg = d3.select("body").append("svg:svg")
.attr("width", 170)
.attr("height", 490);
var card = svg.selectAll("rect")
.data(cds)
.enter().append("svg:g")
.attr("class", "card")
.attr("transform", function(d,i) {
d.x = 10;
d.y = 10+i*(10+cardsize.height);
return "translate(" + d.x + "," + d.y + ")";
});
card.append("svg:rect")
.attr('width', cardsize.width)
.attr('height', cardsize.height)
card.append("svg:foreignObject")
.attr('width', cardsize.width)
.attr('height', cardsize.height)
.append('p')
.attr("class","statement")
.text(function(d) …
Run Code Online (Sandbox Code Playgroud) 我正在使用AngularJS,并希望在动画完成时收到通知.我知道这可以通过像这样的javascript定义的动画来完成myApp.animation(...)
,但我很好奇我是否可以在没有javascript的情况下执行此操作.
问题:是否可以使用角度ng-enter和ng-leave css-transitions,并指定完成回调?我猜这个animationend
事件被解雇了,所以应该有办法做到这一点.
我有这个:
HTML:
<div ng-if="item" class="myDiv"> {{ item.name }} </div>
Run Code Online (Sandbox Code Playgroud)
CSS:
.myDiv.ng-enter {...}
.myDiv.ng-enter.ng-enter-active {...}
.myDiv.ng-leave {...}
.myDiv.ng-leave.ng-leave-active {...}
Run Code Online (Sandbox Code Playgroud)
我想myDone()
在动画结束时调用(即ng-enter-active
删除类后).
我正在开发一个项目,我想围绕一些SVG元素绘制一条线,以便选择区域内的对象.
这是我现在所拥有的截图.我已经使用Paint来添加线条,以便清楚地表明我想要实现的目标.我想rect
在绘制的圆圈内选择两个.
截图http://s23.postimage.org/y6t5t9be3/Screen_Shot_2013_02_26_at_15_31_26.png
我看到了许多必须解决的步骤:
path
在at处创建一个元素mousedown
并记录鼠标移动直到mouseup
path
如果用户没有画圆圈,请关闭你看到哪种方法,你对如何去做有什么建议吗?
我正在使用useReducer
,并且想要dispatch
2 次。是否保证第二次输入到减速器的状态是第一次更新的输出?
如果我这样做
dispatch({ type:"RESET" }); // set state to default state
dispatch({ type:"LOAD", id: "abc" }); // set id
Run Code Online (Sandbox Code Playgroud)
我能确定那个状态会是吗{ ...defaultState, id: "abc" }
?
javascript ×6
svg ×5
angularjs ×4
d3.js ×4
animation ×1
backbone.js ×1
convex-hull ×1
css ×1
html ×1
jquery ×1
react-hooks ×1
react-redux ×1
reactjs ×1