Giter Site home page Giter Site logo

angular / angular Goto Github PK

View Code? Open in 1sVSCode Editor NEW
82.1K 3.1K 21.0K 388.49 MB

The modern web developer’s platform

Home Page:

License: MIT License

JavaScript 8.94% HTML 2.03% CSS 0.97% Shell 0.30% TypeScript 85.10% PHP 0.03% Dockerfile 0.04% Starlark 2.10% SCSS 0.50% Less 0.01% jq 0.01%
angular typescript web javascript pwa web-framework web-performance

angular's Introduction

Angular - The modern web developer's platform.

Angular is a development platform for building mobile and desktop web applications
using Typescript/JavaScript and other languages.

Contributing Guidelines · Submit an Issue · Blog

CI status   Angular on npm   Discord conversation


Get started with Angular, learn the fundamentals and explore advanced topics on our documentation website.


Development Setup


Setting Up a Project

Install the Angular CLI globally:

npm install -g @angular/cli

Create workspace:


Run the application:

ng serve

Angular is cross-platform, fast, scalable, has incredible tooling, and is loved by millions.


Get started in 5 minutes.


angular ecosystem logos


Learn about the latest improvements.


Check out our upgrade guide to find out the best way to upgrade your project.


Contributing Guidelines

Read through our contributing guidelines to learn about our submission process, coding rules and more.

Want to Help?

Want to report a bug, contribute some code, or improve documentation? Excellent! Read up on our guidelines for contributing and then check out one of our issues labeled as help wanted or good first issue.

Code of Conduct

Help us keep Angular open and inclusive. Please read and follow our Code of Conduct.


Join the conversation and help the community.

Love Angular badge

Love Angular? Give our repo a star ⬆️.

angular's People


gkalpak avatar petebacondarwin avatar IgorMinar avatar vsavkin avatar vicb avatar tbosch avatar alxhub avatar devversion avatar mhevery avatar josephperrott avatar alexeagle avatar pkozlowski-opensource avatar renovate-bot avatar kara avatar AndrewKushnir avatar matsko avatar atscott avatar JoostK avatar alan-agius4 avatar crisbeto avatar chuckjaz avatar mgechev avatar marclaval avatar gregmagolan avatar kyliau avatar AleksanderBodurri avatar jbogarthyde avatar ocombe avatar jasonaden avatar kapunahelewong avatar


Arif avatar  André Da Silva avatar sadiul-hakim avatar Mahmoudelsayedmahmoud  avatar  avatar  avatar Helton Reis avatar  avatar  avatar Lukas Schmyrczyk avatar Sampson Orson Jackson avatar Yago Peixinho avatar Georgy Petukhov avatar Cameron Remesz avatar  avatar  avatar MeowMeowWithWind avatar Laura Bigoni avatar  avatar jGeek avatar  avatar Scarqin avatar Theshy avatar ItsPievee avatar Norman Zhou avatar Abhishek_S avatar Ignacio Diaz avatar hongwu avatar Sleazy_Wheezy avatar Kyuuseiryuu avatar koyasaeki avatar  avatar Matheus Cezar Santos avatar  avatar  avatar Ysmael Marques avatar Douglas Pereira de Almeida avatar Kevin.Jimenez24 avatar Anirudh Kanakatte avatar  avatar Javier Ferrer Sánchez-Barcaiztegui avatar Rodrigo Berrios avatar Edoardo Lucà avatar  avatar Folagbade Olowofela avatar Artem avatar Thibaut Leneveu avatar Shiro Kyo avatar yo-dm avatar Antoine avatar Hiep Pham avatar Doriel Rivalet avatar Jordan Singh avatar  avatar Alejandro D. Guevara avatar Ahmed Gamal avatar dheya avatar De Wet van der Merwe avatar  avatar  avatar Θεός Άρης avatar Sumit Kumar Hansdak avatar Đỗ Xuân Tiến avatar  avatar Sergey avatar  avatar Rémi Lux avatar ACoreX UI avatar Salim avatar Dean Friedland avatar Ertunga Bezirgan avatar Samuel Lima avatar atwoodDodd avatar Ludovic de Souza Beghin avatar  avatar Mohamed Salem avatar Haseeb Ahmed avatar YellowBean avatar GuilhermeDSGL avatar Andreas Kornblum avatar Renee avatar LaDzy avatar Kian_ avatar  avatar Redouane Bekkouche avatar Tim Hansen avatar Peyman Bayat avatar  avatar Nam Tran avatar  avatar Nikolay Derkachev avatar  avatar Marios Zafeiriou avatar ITPEY avatar Leandro Luna avatar  avatar Michael Orr avatar Anvarmirzo avatar 代码修理工 avatar Ítalo avatar


Ari avatar Jeroen Zwartepoorte avatar Ken Rimple avatar Dario Alves Junior avatar Jorge Cuadrado avatar Kozo Nishida avatar Jason Mountain avatar Levi Stanley avatar Dinesh Puspparajah avatar Raju Gandhi avatar Manuel avatar Kris Shannon avatar Justin Roth avatar Laura Jacobsen avatar José Steven Viana avatar XdF avatar Abhik Khanra avatar [T] NepTunic avatar Joshua Kappers avatar Mark Hebert avatar Noam  Vergain avatar Tiago Justino avatar Aurimas Valionis avatar Jason Craft avatar Panayiotis Tzagkarakis avatar Sysmat avatar Bob James avatar  avatar x16man avatar Aakarsh Nair avatar  avatar  avatar Nurul Ferdous avatar Masaaki Kurihara avatar Ricardo Soares avatar  avatar Salem Khan avatar Michael Sparmo avatar Jason Bedard avatar Nguyen Tien Si avatar Emtec avatar  avatar Shumpei Shiraishi avatar ROHITHA DASSANAYAKE avatar Miško Hevery avatar Masao Ochi avatar takeratta(tm)* avatar TJ Trapp avatar Ward Bell avatar  avatar Rajesh Odayanchal avatar Hilton Gonçalves avatar Anton Mamrashev avatar Juan Suarez avatar Luis Furnas avatar 大鼻子 avatar ToucheComm avatar Stéphane Vasseur avatar Tushar Wadekar avatar Mikael Tollefsen avatar David Arturo Carrillo Atondo avatar davidwei_001 avatar Josh Iverson avatar Stéphane P. Péricat avatar nant avatar Wolfgang Born avatar evandrix avatar Brett Senna avatar Pekka Kuismanen avatar Allen Galler avatar  avatar Clayton K. N. Passos avatar George Frick avatar Andy Sharkey avatar  avatar Verious Smith III avatar Igor Minar avatar  avatar moueza avatar Jeroen van Heel avatar Masahiro Hayashi avatar Gautam Pandey avatar Tyrone Neill avatar yury avatar Tuan Nguyen avatar Everton Yoshitani avatar send2vinnie avatar Bert Verhees avatar Joeri Boudewijns avatar  avatar Brian Turgeon avatar André Kaufmann avatar Ming Ho avatar  avatar Tarmo avatar Michael R Basher avatar Yago Carballo avatar Anders Sjögren avatar António Silva avatar MASSE avatar

angular's Issues

build: add travis-ci

For now run the following:

  • gulp build: automatically runs dartanalyzer, so we get early errors via the static type system of dart
  • karma run: run some basic tests to ensure the JS modules are loading and have correct dependencies

Needs to download dart environment...

transpiler: handle named parameters

 it('should compile named params when the last argument is a map', function() {
    function f(a, {b, c}) {return a + b + c;}

    expect(f(1, {b: 2, c: 3})).toBe(6);

  it('should compile to a map when keys are quoted', function() {
    function f(m) {return m["a"] + m["b"];}

    expect(f({"a": 1, "b": 2})).toBe(3);

Refactor the transpiler to better support both Dart and JS

Currently we use either the original Traceur transpiler or the or the Dart transpiler (which inherit from the Traceur transpiler).

But we plan to augment the Traceur syntax to support ie class fields (#66).

The target architecture should probably be
Original Traceur transpiler <- Angular specific JS transpiler <- Dart transpiler
(where "<-" = inherits from).

Regarding the folder structure, I think we should have:

 +-- src
    +-- Dart        
         +-- codegeneration
         +-- outputgeneration
    +-- JS      
         +-- codegeneration
         +-- outputgeneration

Thoughts ?

transpiler: support let in dart

let a = 1; should work.

JavaScript's "let" is the same as Dart's "var" -- this is needed to apply more semantically correct transpilation.

transpiler: add sourcemaps

when an exception is reported the stack trace is from transpiled file, but my code is in source file.

Need to generate source maps for debug code
Need to rewrite stack trace to have original line numbers.

transpiler: Run transpiler tests

@tbosch from you last email:

all tests are written in jasmine/guinness and executed via karma, including the tests for the transpiler

I can not find a way to run the transpiler spec with the latest master.

I can generate the dart files by requiring the gulp-tasks file from the main gulpfile and install() it.
Then run_specs.dart is missing.

What is the correct way to do this ?

(I can not post on the ng mailing list which is why I create this issue here)

Add throttle argument for $watch

So, I have a snippet of code that I keep copy and pasting all over my controllers for handling "auto-saving" functionality for objects:

var pendingPromise = null;
        //Set up watch to auto save CTA on changes, but throttled once every 500ms.
        $scope.$watch('myObject', function(nv, ov){
            if((nv && ov) && (!_.isEqual(nv, ov))){
                if (pendingPromise) {

                pendingPromise = $timeout(function () {
                }, 500, false);
        }, true);

I do this so that the API the underlying service talks to doesn't get inundates w/ requests, especially for ui components like sliders that change the model incrementally very quickly. If would be wonderful if in some later release of Angular if this were condensed down to something like:

$scope.$throttledWatch('myObject', function(nv, ov){
}, true, 500);

Where 500 is the time in milliseconds to set on the throttle.

transpiler: Improve transpiler tests

As today we test the transpiler by running the spec in JS and Dart. While this is a good start, there is room for improvement.

Asserting that some code snippets fail (with a given error message) could also really help improving the test suite.

An example could be for the generation of const constructor: in Dart such constructor could not have a body (it can only have an initializer list). Asserting that this case fails with a comprehensible error message would be really helpful.

Make fields first class citizens in ES6+A

Currently fields are declared as:

class Annotation {
  @FIELD('final name:String')
  @FIELD('final age:int')
  @CONST constructor(name:String, age:int) { = 'Hello ' + name;
    this.age = age + 0;

@Annotation('usage', 5)
class Foo {}

should be

class Annotation {

  @CONST constructor(name:String, age:int) { = 'Hello ' + name;
    this.age = age + 0;

@Annotation('usage', 5)
class Foo {}

This is based on TypeScript, we should follow whatever they are doing.

  1. Do they allow inline initialization of fields
  2. Do they generate code to set fields to null if the constructor does not set them explicitly.

Integrate dartanalyzer into build

this implies we need angular.dart file which looks something like this:

library angular.dom.main;

export "annotations/directive.dart";
export "annotations/component.dart";
export "annotations/property.dart";
export "annotations/template.dart";
export "annotations/event.dart";
export "directive_injector/annotations.dart";
export "directive_injector/directive_injector.dart";
export "directive_injector/query.dart";
export "view/view.dart";
export "view/view_ref.dart";
export "view/view_factory.dart";
export "view/view_port.dart";
export "view/view_port_ref.dart";

Don't generate that, but we need something like this as public API.

transpiler: Error in assertion of return value of nested functions

E.g. in this method traceur says that the return value "true" does not match ArrayOfDirectiveClass. It seems to check the return value of the nested function against the return type of the method...

class Test {
someMethod(directive:Function):ArrayOfDirectiveClass {
    return annotations.filter((annotation) => {
      return annotation instanceof Directive;
    }).map((directiveAnnotation) => {
      return new DirecrtiveClass(directiveAnnotation, directive);

ng-option issue

Hi people... I came with this problem before but I haven't been taken seriously.

Ng-option doesn't work properly. I should be able to compare objects rather than put my selection in a different variable.

It should see that if I declare a parameter in, for example a users variable, where I declare what that user works, and then I declare all the jobs out there, it should compare that property and not make me work around it.

Please take me seriously this time.

PS: Really good job.

Clarify what this project is about

Could you please clarify in the what this project is there for? That is, of course, if you don't mind sharing it with the public :-)

Bare bones change detection

We would like to implement bare bones change detection so that we can unblock ourselves for other parts of the system and work on them in parallel.

I would love to get a very simple change detection going which can only watch simple properties such as foo or bar ie no ( or foo().bar or anything of that sort)

We should be able to implement this without the need for parser.

class Person {
  var age;

var person = new Person();
var pwg = new ProtoWatchGroup();'age');
var wg = pwg.instantiate();
var cd = new ChangeDetection(wg);

Make this test pass:

it('should do simple watching', function() {

Transpiler: should we support Dart libraries ?

As of today each transpiled file as a library statement. The library name is unique and is derived from the file name.

Dart support private members (& functions & variables). Private members start with a "_" prefix.

A private member (/ function / variable) is visible to the entire library (whether it is accessed from the same class or file).

Currently dartanalyzer prints some warnings because "_" prefixed members are accessed from an other file (hence an other library).

What would be the right solution to support this:

  • Support librarystatement in the source code (may be via @LIBRARY('name') if possible),
  • Transform "_" prefixed names,
  • ?

A short term solution could be to avoid "_" prefixed names but we should also have a longer term strategy IMO.

Should we infer class property types from ctor args ?

Currently we infer property types from from ctor args (by name) which could produce wrong results

// js
class A {
  constructor(a: Number, b: String) {
    // notice how property & arg name doesn't match
    this.b = a;
    this.a = b;

// -> dart
class A {
num a;
String b;
  A(num a, String b) {
    // it results in wrong types   
    this.b = a;
    this.a = b

Things we can do:
1- Stop inferring property types from args (which would always produce valid code, but types are lost),
2- Write some logic to infer types (do not infer types based on names but get the type from the rhs, the types would always be correct but it requires more code),
3- Keep the current logic as it would probably be correct in 99% of the cases.

I would tend to go for something right (1) rather than something mostly right (3). We could implement 2 at a later point in time.

Thoughts ?

transpiler: constructor and typed field semantics

  1. Only allow assignments to fields in constructor and translate these assignment into constructor initializers
  2. Make field declaration explicit through @FIELD annotation
  3. Make const constructors in Dart through @CONST annotation


class Annotation {
  @FIELD('final name:String')
  @FIELD('final age:int')
  @CONST constructor(name:String, age:int) { = 'Hello ' + name;
    this.age = age + 0;

@Annotation('usage', 5)
class Foo {}

this needs to transpile to:

class Annotation {
  final String name;
  final int age;
  const Annotation(String name, int age): 
     name = 'Hello ' + name,
     age = age + 0;

@Annotation('usage', 5)
class Foo {}

Run dartanalyzer an all files including on tests

Currently the dartanalyzer does not run on test files and it runs separately for each module. We should generate a single file which references all of the files across all of the modules and then run dartanalyzer only once.

generated file: _all_.dart

export './moduleA/file1.dart';
export './moduleA/file2.dart';

export './moduleB/file1.dart';
export './moduleB/file2.dart';

Change named parameter format



requires that we repeat the value twice

proposed syntax


transpiler: reexport of facades

Often times it is useful to be able to re-export facade types. This requires the support of rexporting.

import {Foo} from 'bar';
export Foo;
export 'bar' show Foo;

transpiler: Refactor the transpiler

From #18 (which has been closed):

Some related question: today there is only one dart_class_transformer.js that has all the transformations.

To be more compliant with the original Traceur code, it would probably makes sense to have a DartTransformer that would be the main entry point and every single transformation defined in a separate class & file. All those files should be hosted in a codegeneration folder.

I'm not sure if GH is the best place to discuss this kind of thing. Should we create a "js2dart" room in flowdock ?

This could easily allow running some of the existing transformers which are required. As an example, hoisting is not handled today while a transformer (HoistVariableTransformer exists and can be used)

Assert that all _ are not exported and non_ are not

export class _FOO {}
class BAR{}

should be an error because _FOO is private in Dart and BAR is exported regardless of export keyword in source file. For this reason we have to assert that all top level identifiers are exported unless they contain _ prefix.

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.