rolandjitsu / angular-lab Goto Github PK
View Code? Open in Web Editor NEWAngular Lab
Home Page: https://angular-lab.rolandgroza.io
License: MIT License
Angular Lab
Home Page: https://angular-lab.rolandgroza.io
License: MIT License
Firebase has a new release of firebase-tools so it would be nice to use the new API and to use as a gulp task.
Hi guys.
I used your example from here in order to implement dynamic async validaton.
After I've updated my angular to beta I have the next issue:
I tried to do it with running validate method using OnChange interface and ngOnChange method - no results.
If I use composeAsync my control.errors is broken because it becomes not a plain JS object as it should be, but the promise.
Please, help.
Here is my directive's code:
import {
provide,
Directive,
OnInit,
ElementRef,
} from 'angular2/core';
import {
NG_ASYNC_VALIDATORS,
Control,
Validator
} from 'angular2/common';
@Directive({
selector: '[duration]',
properties: [
'notParsedValue: duration',
'message: durationMsg',
'control: ngControl'
],
providers: [
provide(NG_ASYNC_VALIDATORS, {
useExisting: Duration,
multi: true
})
]
})
export class Duration implements Validator, OnInit {
public notParsedValue: string;
public message: string = 'File duration is invalid';
public control: Control;
// some inner logic here ...
/**
*
* @param control
* @returns {Promise<T>}
*/
validate(control: Control): {[key: string]: any} {
console.log('Duration validator running');
return new Promise( resolve => {
if (this._doesInputFilled(this.control) && this._shouldRun()) {
this._validate(this.control.value).then(resolve, err => {
this._addError(err);
resolve(err);
});
} else {
resolve(null);
}
});
};
/**
*
* @param element
*/
constructor(element:ElementRef) {
this._element = element;
// ...
}
/**
*
*/
ngOnInit() {
console.log('Duration directive OnInit', this);
// ...
}
}
Show an example of using async validators.
Properly document the Firebase hosting setup.
It looks like there is a weird whitespace error during linting. Opened #36 on gulp-tslint and #805 on tslint.
Write a few E2E tests to have as example.
It looks like with the latest alpha update (45
), all SVG renderings are broken.
When web workers are more stable in Angular 2, implement a simple example using web workers. There are many examples out there, including this.
Figure out a good schema to use for the chores/todos in the Firebase backend now that users have been introduced. Also store users and implement logic to handle users that authenticate using different methods but have the same identity.
Components like <checkbox>
should be moved to the app/common
folder.
Until Angular Material will be ported to Angular 2, use Polymer (Material Design Lite does not work well with dynamic websites).
It seems like using karma-jspm would be the best option for loading all TS assets in the browser and running the unit tests.
Perhaps the current gulp solution for running the unit tests and the app in parallel is not the best one, let's come up with a better one.
For users using their own Travis CI, it would be nice to document the steps for setting up the project with Travis, but also using Saucelabs for tests and deployments to Firebase.
It looks like unit tests are failing because the component are loading the styleUrls
.
It looks like TSD is being deprecated in favour of Typings.
Now that we have authentication we need to implement some authorization for our data endpoints using Firebase Security rules. Also, keep then in a rules.json
file in the repo so other users can benefit as well.
At some point firebase_array.ts should be moved into its own repo as it might be useful for other devs. Currently it has no dependency on Angular 2, it will only depend on ES6 shims and Firebase.
As of right now, the only thing users can do in the account area is change their password. It would be nice to have a few more things and also handle the password for users that have singed up using Google/Github.
Just make a simple example illustrating how to use HTTP interceptors. Use this post for guidelines.
At least one one unit and e2e test case inclusion will be great help
Have a few performance tests for important areas in the app.
It would be more helpful if you could drop the traceure dependency and migrate to Typescript.
If a user used Github or Google for signing up, he/she does not have a password, this changing password would not work. Figure out a good way for the user to set a password in this case instead of changing it.
When I trying to move normalize css
and firebase
dependency to npm and drop bower, getting below error in browser console. But application is working fine without any other error.
Any idea about this?
Uncaught ReferenceError: module is not defined(anonymous function) @ firebase-web.js:264
Create a couple of custom validators examples.
It would be nice to have some of the things from web-starter-kit integrated in this project.
Figure out a way to have a production and development setup.
Note: Using TS --out bundle.js
will concat all compiled code into one file, try using that in combination with gulp.
There is a very good post on how to use them, show a brief example in the app.
It would be a good idea to have a better structure for the data so that it would allow for better and more comprehensive/restrictive security rules. Check Stackoverflow question for more info.
Use fakes where it's appropriate in unit tests.
First off, many thanks for putting this project out there. I've learned quite a bit about angular2 and firebase just by looking through the code.
My end goal is to be able to have Chores shared between users. I'm currently looking at services.ts and believe I can do this very simply by removing /${user.key}
on line 24. But doing just that seems pretty hack like. If I'm not going to need User then there is probably several lines of code I can remove here. However, my understanding of Angular2 services and also Promises is not so good. Do you have any insight on how this code could be restructured for my needs? Thanks!
It would be great to have Angular2 Material support out of the box.
A declarative, efficient, and flexible JavaScript library for building user interfaces.
๐ Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
The Web framework for perfectionists with deadlines.
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. ๐๐๐
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
We are working to build community through open source technology. NB: members must have two-factor auth.
Open source projects and samples from Microsoft.
Google โค๏ธ Open Source for everyone.
Alibaba Open Source for everyone
Data-Driven Documents codes.
China tencent open source team.