我有这个组件:
import React from 'react';
export default class AddItem extends React.Component {
add() {
this.props.onButtonClick(this.input.value);
this.input.value = '';
}
render() {
return (
<div className="add-item">
<input type="text" className="add-item__input" ref={(input) => this.input = input} placeholder={this.props.placeholder} />
<button disabled={!this.input.value} className="add-item__button" onClick={this.add.bind(this)}>Add</button>
</div>
);
}
}
Run Code Online (Sandbox Code Playgroud)
我想在输入值为空时禁用该按钮.但上面的代码不起作用.它说:
add-item.component.js:78 Uncaught TypeError:无法读取未定义的属性"value"
指着disabled={!this.input.value}.我在这里做错了什么?我猜测,当render执行方法时,可能还没有创建ref .如果,那么什么是workararound?
我有个问题.我正在使用苗条,我有我的主页的路线:
$app->get('/', function() use ($app) { ...
Run Code Online (Sandbox Code Playgroud)
在我的一个控制器中,我想重定向到主页面,所以我写了
$app->response->redirect('/', 303);
Run Code Online (Sandbox Code Playgroud)
但是,我没有重定向到'/'路由,而是被重定向到我的本地服务器的根目录 http://localhost/
我究竟做错了什么?我该如何使用重定向方法?
我想创建一个指令,决定是否应该或不应该在页面上的主机元素apppear.理想情况下,我希望它从DOM中删除元素,而不是用css隐藏/显示它.用例是:
<ul role="navigation">
<li><a>public link</a></li>
<li><a>public link2</a></li>
<li access="admin"><a>admin-only link</a></li>
</ul>
Run Code Online (Sandbox Code Playgroud)
它将使用UserService来获取currentUser角色,如果没有管理员,那么li将被删除.
我想ng-if通过将表达式传递给主要组件中的evaulate,我可以实现相同的效果(如果它仍然在角度2中可用).但是使用该指令它更具语义和优雅.
可能吗?
import {Directive} from 'angular2/angular2';
@Directive({
selector: 'access'
})
export class Access {
//what goes here
}
Run Code Online (Sandbox Code Playgroud)
我可以在角度1(内部指令的compile函数)中轻松完成,但我怎么能在Angular 2中做到这一点?
我有一个服务,它使用其get方法从服务器获取数据:
export class UserService implements IRestService<User> {
constructor(public http: Http) {
}
get(): Rx.Observable<User> {
return this.http.get('api/ui_user', <any> {
headers: {'Accept': 'application/json'}
})
.toRx()
.map(res => res.json());
}
Run Code Online (Sandbox Code Playgroud)
我有一个使用此服务的组件.
constructor(emplService: EmployeesService, userService: UserService){
this.emplService = emplService;
this.isDisplayMenu = false;
this.user = new User();
userService.get()
.subscribe(usr => {
this.user = usr;
});
}
Run Code Online (Sandbox Code Playgroud)
因为数据是异步获取的,所以组件被实例化并呈现,并且仅在接收到该数据之后.View会被数据填充并最终看起来不错,但起初我在控制台中有错误:
GET data:image/png;base64,undefined net::ERR_INVALID_URL
Run Code Online (Sandbox Code Playgroud)
它发生在我看来:
<img class="user-avatar" [src]="'data:image/png;base64,' + user.avatar">
Run Code Online (Sandbox Code Playgroud)
我希望组件在呈现自身之前等待直到收到数据.这可能吗?我在考虑生命周期钩子,但文档很差,我无法理解.
我有一个采用模板驱动形式的组件
<form (ngSubmit)="onSearchCorpus(form)" #form="ngForm">
<combo-box [(ngModel)]="model.corpus" name="corpus" #corpus="ngModel"></combo-box>
<input [(ngModel)]="model.label" name="label" id="label" type="text" required pattern="^(?!\s*$)[\w\_\-\:\s]*" maxlength="50" class="form-control label-name" autocomplete="off" #label="ngModel">
<textarea [(ngModel)]="model.query" name="query" id="query" maxlength="3600" required validateQuerySyntax class="form-control search-query" #query="ngModel" #queryControl
placeholder="Example: ("grantee" OR "grant" OR "sponsor" OR "contribute" OR "contributor") NEAR ("non-profit organization" OR "charities")">
</textarea>
<button [disabled]="corpusValidationInProgress" type="submit" class="button-level-one">Search</button>
</form>
Run Code Online (Sandbox Code Playgroud)
在处理表单提交的方法中,我访问控制 NgForm实例的属性,它在浏览器中工作正常.
onSearchCorpus(formData: NgForm) {
...
const corpusErrors = formData.controls.corpus.errors;
...
}
Run Code Online (Sandbox Code Playgroud)
但是,当我尝试使用Karma测试此方法时,NgForm的controls属性为空.我很困惑为什么会这样.该方法失败并出错cannot read property "errors" of undefined.
以下是我的测试结果:
it('should not perform corpusSearch …Run Code Online (Sandbox Code Playgroud) javascript unit-testing angular2-forms angular2-testing angular
我正在编写应该使用 json 发送请求的批处理脚本。
call curl -X POST -H 'Content-type: application/json' --data '{"text": "Pull requests:\n%linksText% has been deployed to %stagingServerUrl%", "username": "Staging Server"}' http://requestb.in/ovehwtov
Run Code Online (Sandbox Code Playgroud)
我从 git bash 运行我的脚本,虽然它发送了请求,但正文格式不正确,就在它发送请求之前,我在控制台中看到错误:
curl: (6) Couldn't resolve host 'application'
curl: (6) Couldn't resolve host '"Pull'
curl: (6) Couldn't resolve host 'requests:\nhttp'
curl: (6) Couldn't resolve host 'has'
curl: (6) Couldn't resolve host 'been'
curl: (6) Couldn't resolve host 'deployed'
curl: (6) Couldn't resolve host 'to'
curl: (6) Couldn't resolve host 'unicorns2url",'
curl: (6) Couldn't resolve host …Run Code Online (Sandbox Code Playgroud) 为什么basename()在PHP脚本中使用此函数实际执行的操作可能分为两行:
$subFolders = preg_split("!\\\|\\/!ui", $path); // explode on `\` or `/`
$name = array_pop($subFolder); // extract last element's value (filename)
Run Code Online (Sandbox Code Playgroud)
我错过了什么吗?
但是,如果文件名中有一些\或其中/,我猜这上面的代码可能无法正常工作.但这不可能,对吗?
我正在玩 html5 画布,我遇到了一些奇怪的行为。我正在根据以下三个步骤制作非常基本的动画:
this.ctx.clearRect(0, 0, this.canvas.width, this.canvas.height);这就是我绘制数字的方式:
// drawing a circle
function drawCircle(x,y) {
var rad = 5;
ctx.beginPath();
ctx.arc(x, y, rad, 0, 2 * Math.PI);
ctx.closePath();
ctx.fill();
}
// and a rect
function drawRect(x, y,) {
var width = 60,
height = 10;
ctx.fillRect(x, y, width, height);
}
Run Code Online (Sandbox Code Playgroud)
现在我希望我的矩形是 60px 宽和 10px 高。我在<canvas>标签后添加了一个 div并将其宽度和高度分别设置为 60px 和 10px 以说明差异。正如你在图片上看到的,显然我的矩形不是 60?10。这同样适用于圆。我在这里缺少什么?

这是小提琴
所以在我的控制器中我写道:
...
public function execute()
{
$dbh = AppHelper::instance()->getConnection();
$manager = new PostManager($dbh);
$posts = $manager->getAllPosts();
$twig = AppHelper::twig();
// var_dump($twig);
//var_dump($posts);
$twig->render("posts.html.twig", array(
'title'=>'??? ??????',
//'posts'=>$posts,
'debug' => true
));
}
...
Run Code Online (Sandbox Code Playgroud)
我有一个基本的布局树枝模板:
<!DOCTYPE html>
<html>
<head>
<title>
{% block title %}
{% endblock %} - ?????? ????
</title>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width">
</head>
<body>
<div>
{% block content %}
??????????? ??? ? ???? ????????? ?????!!
{% endblock %}
</div>
</body>
</html>
Run Code Online (Sandbox Code Playgroud)
我的帖子模板:
{% extends "main.html.twig" %}
{% …Run Code Online (Sandbox Code Playgroud) angular ×3
javascript ×3
php ×3
batch-file ×1
canvas ×1
cmd ×1
css ×1
curl ×1
filenames ×1
filepath ×1
git-bash ×1
html ×1
reactjs ×1
redirect ×1
regex ×1
slim ×1
twig ×1
typescript ×1
unit-testing ×1