小编Dea*_*ool的帖子
D3 - 向简单折线图添加网格
在下面的简单折线图中，我想在 x 和 y 轴上添加网格。有人可以帮助我吗？
片段：
<html>
<head>
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.4.12/angular.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/d3/4.3.0/d3.min.js"></script>
</head>
<body ng-app="myApp" ng-controller="myCtrl">
<svg></svg>
<script>
//module declaration
var app = angular.module('myApp',[]);
//Controller declaration
app.controller('myCtrl',function($scope){
$scope.svgWidth = 800;//svg Width
$scope.svgHeight = 500;//svg Height
//Data in proper format
var data = [
{"letter": "A","frequency": "5.01"},
{"letter": "B","frequency": "7.80"},
{"letter": "C","frequency": "15.35"},
{"letter": "D","frequency": "22.70"},
{"letter": "E","frequency": "34.25"},
{"letter": "F","frequency": "10.21"},
{"letter": "G","frequency": "7.68"},
];
//removing prior svg elements ie clean up svg
d3.select('svg').selectAll("*").remove();
//resetting svg height and …推荐指数
解决办法
查看次数
添加毫秒到日期并通过JavaScript获取新日期
我想要一年的第一个星期天.我可以获取一年中的第一天并添加第一个星期日的剩余天数(比如说2016年的2天),现在想要通过为2天添加毫秒来确定新日期.但我没有得到理想的结果.请帮忙.
<script>
//I want to get date for 1st Sunday of Year
var year = 2016;
var date = new Date(year,0,1);
var day = date.getDay();
var dayDifference = ((7 - day)%7);
var firstSunday = date.getMilliseconds() + (dayDifference * 86400000);
console.log(new Date(firstSunday));
</script>
结果:
周一至周五1970年05:30:00 GMT + 0530(印度标准时间)
我预计日期是2016年1月3日
推荐指数
解决办法
查看次数
角度-高度和宽度的属性绑定不适用于图像
我正在尝试在Angular中进行属性绑定的示例。我决定拍摄一张图像，然后通过属性绑定放置它的所有3个属性-宽度，高度和src。令我惊讶的是，虽然没有错误，并且图像通过URL呈现（URL中没有错误），但宽度和高度仍呈现为零（0）。为什么这个？据我所知，Image将高度和宽度作为其属性。那问题在哪里呢？
abc.component.html
//This does not work - gives height:0px, width:0px
<img [width]="'100px'" [height]="'100px'" [src]="'./assets/img/hermione.jpg'">
//This works - renders image, with height:100px, width: 100px
<img width="100px" height="100px" [src]="'./assets/img/hermione.jpg'">
有人可以通过奇怪的行为来解释为什么第二种情况运行良好，但首先虽然图像被渲染但从未被看到（高度：0px，宽度：0px）？
错误：
另外，（根据Pronoy Sarkar的要求-参见下面的答案）
//This also works
<img [attr.width]="'100px'" [attr.height]="'100px'" [src]="'./assets/img/hermione.jpg'">
现在，问题是为什么简单的[高度]和[宽度]不起作用？毕竟，我们从未做过[attr.src]吗？
推荐指数
解决办法
查看次数
在构造函数中放置方法或在类中放置方法的差异（给出相同的结果）
以下 2 个片段给出了相同的结果。我想知道这两种方法的真正区别是什么，什么时候应该使用一种方法而不是另一种方法。有人可以帮助我理解其中的区别吗？
情况1：
class Person{
constructor(name){
this.name = name;
}
printData(){
console.log(this.name);
}
}
案例2：
class Person{
constructor(name){
this.name = name;
this.printData = function(){
console.log(this.name);
}
}
}
推荐指数
解决办法
查看次数
jQuery.contains()无法正常工作
在下列情况下我应该得到一个"警报",但我没有得到任何"警报".我正在尝试一个简单的例子jQuery.Contains().
<html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>
<script>
$(document).ready(function() {
var alpha = $.contains('body','p') {
alert(alpha);
});
</script>
</head>
<body>
<p>This is a paragraph.</p>
</body>
</html>
推荐指数
解决办法
查看次数
将数据格式从单个对象转换为键值对的对象数组
我在一个对象中有一个数据为json格式:
var a = {
"1": "alpha",
"2": "beta",
"3": "ceta"
}
我想将其转换为以下格式:
var b = [
{id: 1, label: "alpha"},
{id: 2, label: "beta"},
{id: 3, label: "ceta"}
];
有人可以建议一种方法吗？
推荐指数
解决办法
查看次数
ngSwitch 是“属性指令”还是“结构指令”？
我对 ngSwitch 指令有点困惑——它是“属性指令”还是“结构指令”。
属性指令用 '方括号编写如 [ngStyle]、[ngClass] 等（我们将其写为 [ngSwitch]，将其称为“属性指令”）。
结构指令用“ aestrick ”编写，如 *ngFor、*ngIf 等（我们将 case 写为 *ngSwitchCase="..." 这意味着它是一个结构指令）。
<div [ngSwitch]="colorValue">
<p *ngSwitchCase="red">Red</p>
<p *ngSwitchCase="blue">Blue</p>
<p *ngSwitchCase="green">Green</p>
</div>
根据上面的代码，将 ngSwtich 分类到任一指令类别会变得非常混乱！有人可以帮助我理解 ngSwitch 的指令类型吗？
推荐指数
解决办法
查看次数
Angular Routing routerLinkActive 类即使在其他链接路由上也不会从基页中删除
我提供了一个运行良好的简单路由示例。唯一的问题是routerLinkActive正在向任何活动链接添加类“baboossa”。当我从家转到其他链接为“关于”或“窗口”时，链接变为橙色（由于 baboossa 类），但我仍然可以看到家也是橙色的。为什么现在我有 2 个链接，其中添加了来自routerLinkActive 的类，并且类没有从家中删除？
应用程序组件.html
<ul>
<li><a [routerLink]="''" routerLinkActive="baboossa">Home</a></li>
<li><a [routerLink]="'/about'" routerLinkActive="baboossa">About</a></li>
<li><a [routerLink]="'/window'" routerLinkActive="baboossa">Window</a></li>
</ul>
<router-outlet></router-outlet>
app.module.ts
import { RouterModule } from '@angular/router';
imports: [
RouterModule.forRoot([
{path:'', component: HomeComponent},
{path:'about', component: AboutComponent},
{path:'window', component:WindowComponent}
])
]
样式文件
.baboossa {background:orange;}
结果：
有人能指出为什么我在 baseone (home) 以外的其他活动链接上得到 2 个橙色背景的问题吗？
推荐指数
解决办法
查看次数
根据屏幕分辨率获取图像 [仅通过 HTML]
在最近的一次采访中，面试官问我你有两张图片：
- 您必须在笔记本电脑和台式机上显示的一张大分辨率图像。
- 您必须仅在手机上显示的一张小图片。
您必须仅在HTML Only的帮助下根据“屏幕分辨率”获取特定图像（这 2 个中的 1 个）。你不应该在 CSS/JS/jQuery 的帮助下做到这一点！
虽然，我的 HTML 非常好，但我无法回答这个问题。有人知道面试官的意思吗？或者什么是正确的解决方案？
推荐指数
解决办法
查看次数
Angular-模板驱动的表单-电子邮件验证未发生
我正在制作一个简单的模板驱动表单，其中带有“电子邮件验证”（不是通过响应表单）。因此，必需的minlength和maxlength都可以正常工作。但是，当我尝试使电子邮件有效时，它会失败。有人可以帮我吗？
abc.component.html
<form #customForm="ngForm" (ngSubmit)="alpha(customForm)">
<input type="text" name="firstName" ngModel #firstName ="ngModel" required minlength="3" maxlength="10"><br/>
<div *ngIf="firstName.touched">
<p *ngIf="firstName.errors?.required">First Name is Required!!!</p>
<p *ngIf="firstName.errors?.minlength">First Name minimum 3 characters are required!!!</p>
<p *ngIf="firstName.errors?.maxlength">First Name max length is 10!!!</p>
</div>
<input type="email" name="email" ngModel #email="ngModel" required><br/>
<div *ngIf="email.touched">
<p *ngIf="email.errors?.required">Email is a required field!</p>
<p *ngIf="email.errors?.email">This is not a valid Email!!!</p>
</div>
<button type="submit" [disabled]="customForm.invalid">Submit</button>
</form>
注意：虽然正在进行电子邮件的必要验证，但是由于输入的模式或数据不正确，因此电子邮件验证div中的第二次验证必须给出错误。
结果：（电子邮件有效，其模式未自动给出错误）
推荐指数
解决办法
查看次数