ETA:我知道有多种方法可以观察我的表单以进行更改.这不是我想要做的.正如标题所说,我在问如何观察对象的变化.下面显示的应用程序仅用于说明目的.请回答我提出的问题.谢谢!
我有这个简单的应用程序:
import { Component, OnInit } from '@angular/core';
export class Customer {
firstName: string;
favoriteColor: string;
}
@Component({
selector: 'my-app',
template: `
<div *ngIf="customer">
<input type="text" [(ngModel)]="customer.firstName">
<input type="text" [(ngModel)]="customer.favoriteColor">
</div>
`
})
export class AppComponent implements OnInit {
private customer: Customer;
ngOnInit(): void {
this.customer = new Customer();
// TODO: how can I register a callback that will run whenever
// any property of this.customer has been changed?
}
}
注意TODO.我需要注册一个回调,它将在任何属性 this.customer发生变化时运行.
我不能在输入上使用ngChange.我需要直接订阅模型的更改. …
我正在使用Laravel 5构建REST API.
在Laravel 5中,您可以子类化App\Http\Requests\Request以定义在处理特定路由之前必须满足的验证规则.例如:
<?php
namespace App\Http\Requests;
use App\Http\Requests\Request;
class BookStoreRequest extends Request {
public function authorize() {
return true;
}
public function rules() {
return [
'title' => 'required',
'author_id' => 'required'
];
}
}
如果客户端通过AJAX请求加载相应的路由,并BookStoreRequest发现请求不满足规则,它将自动将错误作为JSON对象返回.例如:
{
"title": [
"The title field is required."
]
}
但是,该Request::rules()方法只能验证输入 - 即使输入有效,在请求已被接受并传递给控制器之后也可能出现其他类型的错误.例如,假设控制器出于某种原因需要将新书信息写入文件 - 但是文件无法打开:
<?php
namespace App\Http\Controllers;
use Illuminate\Http\Request;
use App\Http\Requests;
use App\Http\Controllers\Controller;
use App\Http\Requests\BookCreateRequest;
class BookController extends Controller {
public function store( BookStoreRequest $request …我正在使用Bootstrap 3,我有一个相当标准的页面布局:左边的一个宽列(.col-md-8)包含纯文本,右边有一个较窄的列(.col-md-4),包含一个表单.
反过来,每个表单字段都包含在一个.form-group.
在我的第一次尝试中,.form-groups溢出了包含列的左右边缘.(确保JSFiddle预览框架至少与Bootstrap的sm断点一样宽.)我添加了一个粉红色的背景div来显示.form-groups 应该保留的框.
在我的第二次尝试中,我添加了一个.container内部.col-md-4,然后包裹每个.form-group内部的a .row 和 a .col-md-4.
这样做的伎俩,但......这是正确和首选的方式吗？这似乎是一个非常多的额外的样板标记,以实现应该有点自然发生的事情.
Bootstrap文档相当不错,但它们掩盖了一些像这样的"大图片"的东西.也许这些东西对于那些已经熟悉响应式CSS的人来说是显而易见的,但对于像我这样的初学者来说这可能会让人感到困惑.
这是我第一次尝试的代码:
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<title> - jsFiddle demo</title>
<script type='text/javascript' src='//code.jquery.com/jquery-2.1.0.js'></script>
<script type="text/javascript" src="//maxcdn.bootstrapcdn.com/bootstrap/3.2.0/js/bootstrap.min.js"></script>
<link rel="stylesheet" type="text/css" href="//maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css">
<link rel="stylesheet" type="text/css" href="/css/result-light.css">
</script>
<head>
<body>
<div class="container">
<h1>Broken version</h1>
<h2>Don't forget to expand the width of this preview window. Otherwise you'll just …我将要描述的行为发生在Chrome 44中,但在Firefox 40 中不会发生.
如果您创建一个振荡器,将其设置为220 Hz的频率,然后在一秒钟后将频率更改为440 Hz,您可以听到明显的滑音效果:不是立即从220变为440,振荡器从原始滑动频率到新的.
下面的代码说明了这种现象:
var ac = new AudioContext();
var osc = ac.createOscillator();
osc.connect( ac.destination );
osc.type = 'sawtooth';
osc.frequency.value = 220;
osc.start( 0 );
window.setTimeout( function() {
osc.frequency.value = 440;
}, 1000 );
window.setTimeout( function() {
osc.stop( 0 );
}, 2000 );我已经检查了OscillatorNode对象的文档,并没有提到这种行为.
我也搜过谷歌,(令人惊讶的是)我找不到任何其他提及这种现象.
这是怎么回事？这似乎不是正确的行为.如果我想让频率滑动,我会使用linearRampToValueAtTime()方法.将频率直接设置为特定值应该......做到这一点.
这只是一个错误吗？我知道这个API仍在不断变化,但这似乎是一个明显的错误 - 这不会通过最粗略的测试.但我也无法想象谷歌会故意以这种方式实施它.
最重要的是:有解决方法吗？
我正在写一个WordPress插件.(但是,这不是特定于WordPress的问题 - 任何使用插件模式的PHP代码库都可能出现这种挑战.)
我的插件使用了流行的第三方库,许多其他常见的WordPress插件也使用它.
显然,如果我的插件和另一个插件都加载了这个库的副本,那么PHP会抛出错误,因为我正在尝试重新声明已经声明的类.
我该如何避免这种冲突？在你回答之前,请考虑为什么我拒绝这些明显的选择:
我可以重命名库的类,或者将它们放在新的命名空间中.我不喜欢这个,因为它涉及修改库文件.如果我以后需要升级到更新版本的库,它将覆盖我的修改.它通常只是一个不优雅的PITA.
在我的插件实际包含库之前,我可以使用class_exists()它来确保它还没有包含在内.我不喜欢这个选项有两个原因:
class_exists()在这里没有帮助我 - 两个插件都无法包含他们需要的ChildClasses而不会引起冲突.那么:如何在不遇到其中一个问题的情况下使用这个库？有没有办法在包含时覆盖库的命名空间(不修改库)？还有其他一些我忽略的解决方案吗？这似乎是一个非常常见的情况.
我正在构建一个 Angular 4 服务，它提供对某些数据的访问。首次实例化此服务时，需要与数据存储建立连接，这是一个异步过程。
在异步连接过程完成之前，如何最好地防止此服务（即组件或其他服务）的使用者尝试使用该服务？
我的服务是否可以通过某种方式告诉 Angular 的引导程序在继续之前等待此承诺解决？
如果重要，该服务注册在providersmy的数组中@NgModule。因此（据我所知），Angular 将构建该服务的单个实例，该实例将提供给任何注入MyService.
明确地说，这是我害怕的场景：
在应用程序引导过程中，Angular 查看MyService模块的providers数组，并调用其构造函数。
MyService的构造函数开始连接过程，这可能需要一两秒钟。
同时，Angular 的引导程序不断向前充电，并呈现我的应用程序的仪表板。
仪表板组件注入MyService，并且（在其自己的构造函数中，或者可能在 中ngOnInit）尝试myService.getData()在建立连接之前调用。
为了说明，这里是这个服务的样子：
import { Injectable } from '@angular/core';
@Injectable()
export class MyService {
private connection;
constructor() {
this.connect().then((connection) => {
this.connection = connection;
// Components should be able to consume this service once execution reaches this point, but not before!
});
}
private connect(): …我遇到了一个非常简单的Angular应用程序的问题.这是一个CodePen ; 相同的代码如下.
在这个程序,你点击一个按钮吃香蕉,并显示在页面上,你已经吃了香蕉的总数.每次点击后,应该有一秒钟的冷却时间才可以吃另一根香蕉.
为此,我做了以下事情:
$scope.cooling_down 是一个布尔值.
$scope.can_eat_banana是一个返回true或false指示"吃香蕉"按钮是否可用的功能.基本上,如果$scope.cooling_down为false ,则返回true .
"吃香蕉"按钮有ng-disabled="!can_eat_banana()".
当用户点击"只吃一根香蕉"按钮,我设置$scope.cooling_down到true,并使用window.setTimeout()安排的回调来设置回false一秒钟后.
(你可能会问:为什么不摆脱$scope.can_eat_banana()完全,而只需使用ng-disabled="cooling_down"按钮？答:因为,随着游戏的发展,逻辑判断玩家可以吃一根香蕉是否会变得更加复杂,它似乎非常的混乱.把这个逻辑放在视图中.)
所以,当我运行这个测试用例时,会发生以下情况:
我加载页面.最初,该按钮已启用.
我点击"吃香蕉"按钮.正如所料,我的代码设置$scope.cooling_down为true,并且按钮被禁用.到现在为止还挺好.
一秒钟后,我传入的回调window.setTimeout()开火了.(我console.log()在回调中有第一行确认它正在运行.)此回调设置$scope.cooling_down回false.(您可以查看控制台以确认值已更新.)但是: Angular没有注意到值已更改.该按钮不会重新启用,并且{{cooling_down}}页面上的令牌仍然卡在上面true.
为什么？为什么Angular会在第一次更改值时注意到(当true用户点击按钮后更改为),但第二次没有注意到(当回调触发并将其设置回时false)？
<!DOCTYPE html>
<html ng-app="game">
<head>
<meta charset="utf-8">
<title>Incredibly Stupid Banana Game</title>
</head>
<body ng-controller="GameController"> …我是AWS的新手.我正在建立一个EC2实例(一个Ubuntu 18.04 LAMP服务器).
我在实例上安装了aws CLI,因此我可以自动执行EBS快照备份.
我还创建了一个具有运行所需权限的IAM角色aws ec2 create-snapshot,并且已将此角色分配给我的EC2实例.
我的问题:是否需要aws configure在EC2实例上运行才能设置AWS Access Key ID和AWS Secret Access Key？我仍然围绕AWS IAM角色 - 但是(因为EC2实例有角色),听起来实例将自动从IAM获取所需的密钥.因此,我认为永远不需要运行aws configure.(事实上,这似乎会适得其反,因为设置的密钥aws configure 会覆盖通过角色自动获取的密钥.)
这些都准确吗？
javascript ×3
angular ×2
typescript ×2
amazon-ec2 ×1
amazon-iam ×1
angularjs ×1
asynchronous ×1
aws-cli ×1
css ×1
laravel ×1
laravel-5 ×1
laravel-5.2 ×1
php ×1
plugins ×1
wordpress ×1