Name: AngularJSの紹介 (Introduction to AngularJS)
Uploaded: 2021-01-14T05:23:02.000Z
Duration: 8 min 59 s
Description: VoiceTubeの動画で発音を聞きながら英語表現を覚えよう！学べる英語：

程度の副詞

IGOR: So I have a very simple HTML, and this is static HTML.

I'm loading Angular, I'm loading Todo on JS, which will

be used for my application, but right now

And the rest is just a static template with

Now, what I want to do is turn this into an Angular

And notice that this HMTL is served just with a static HTTP

server, so there's nothing happening on the server side.

So what I'm going to do, I'm just going to say that

So we have a model, we have view, and we have controller.

So we specify this chunk of DOM is going to be controlled

Now, If I go to todoJS, you'll see the I'm creating a module,

todoApp, which is what I referenced in my ng app.

And within that module, I'm specifying a controller called

@controller, and this is the constructor function for that

Now, the controller takes one argument, scope, which you can

think of as a context that is shared between the controller

So whatever is available in this context is going to be

And then, in my template, I can do something like--

I can say take whatever the username is in the current

context, pipe it through an uppercase filter, and inline

So what I get is Igor's Todo List, because username is set

So your model and the controller lives in the

The template is just HTML, which is converted into DOM.

And then Angular consumes the DOM and brings the two and

And with the repeater, we have constructs like ng-repeat,

which allow you to do something like item in items

So in my controller, I have a model called items.

Each object has a text property and done property.

So I mentioned that scope is the context.

So I'm just going to say, within this context under

named items, this is going to be available.

And then, in my template, I actually want to repeat the

Repeat this li as many times as I have items in the items

array, preserve the current item in this variable so that

So what I'm saying is that I have this li that I want to

So this li becomes a template, and it's going to be cloned as

many times as I have elements in the array.

And now you see the done is true here and false here, but

So I need to actually data bind the input box.

And now, when I change the check box, it's going to

update the model, which will update all the things that are

So this is just very quick introduction to Angular.

Dependency injection is how we structure the application and

break it down into smaller components the can depend on

And the dependency injector will just result the

dependencies between components and instantiate

everything at the right time, which helps you in making your

application more maintainable as well as more testable.

字幕リスト動画再生

AngularJSの紹介 (Introduction to AngularJS)

context

application

component

extend