You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
{{ message }}
This repository was archived by the owner on Jan 17, 2022. It is now read-only.
Copy file name to clipboardExpand all lines: README.md
+22-15
Original file line number
Diff line number
Diff line change
@@ -13,6 +13,19 @@ You can install this package through `Bower` by using the following command :
13
13
14
14
bower install angular-intro.js --save
15
15
16
+
## NPM
17
+
18
+
You can install this package through `NPM` by using the following command :
19
+
20
+
npm install angular-intro.js --save
21
+
22
+
## Webpack
23
+
24
+
You can use this package in your webpack project, first by including `intro.js` and its css file. Next you need to require this package.
25
+
26
+
import ngIntro from 'angular-intro.js';
27
+
28
+
This project will return you the hole angular module so if you want to use as a dependency in your own angular module you would need to reference the name `ngIntro.name`.
16
29
17
30
## How to use
18
31
@@ -22,35 +35,35 @@ The two main directives are `ng-intro-options` and `ng-intro-method`.
22
35
23
36
`ng-intro-options="IntroOptions"`
24
37
25
-
You should create a `$scope.IntroOptions` in your controller which contains the intro.js options. The options are exactly the same as [the original](https://github.com/usablica/intro.js#options). This also allows you to modify the options as part of your controller behavior if necessary. You don't have to use `IntroOptions`, you can specify some other name.
38
+
You should create a `$scope.IntroOptions` in your controller which contains the intro.js options. The options are exactly the same as [the original](https://github.com/usablica/intro.js#options). This also allows you to modify the options as part of your controller behavior if necessary. You don't have to use `IntroOptions`, you can specify some other name.
26
39
27
40
### Start method
28
41
29
-
`ng-intro-method="CallMe"`
42
+
`ng-intro-method="CallMe"`
30
43
31
44
The directive will create a method on `$scope.CallMe` so that you can invoke it yourself later. Make sure the there isn't a method `CallMe` already in your controller. To use the method be sure to wrap it with `$timeout`. You don't have to use `CallMe`, you can specify some other name.
32
45
33
46
### Call the start method
34
47
35
-
You can invoke it from an event such a click,
48
+
You can invoke it from an event such a click,
36
49
37
-
`ng-click="CallMe();"`
50
+
`ng-click="CallMe();"`
38
51
39
52
as long as you are still in the same controller scope. You can also specify a step number in the method call, `CallMe(3);`.
40
53
41
54
You can start the intro from code, either call `$scope.CallMe();`. If the `$scope.CallMe();` doesn't work, it might be because your DOM isn't ready. Put it in a `$timeout`.
42
55
43
56
### Autostart
44
57
45
-
If you set `ng-intro-autostart="true"`, the intro will start as soon as the directive is ready.
58
+
If you set `ng-intro-autostart="true"`, the intro will start as soon as the directive is ready.
46
59
47
60
### Autorefresh
48
61
49
62
If an intro tour includes dynamic content, use `ng-intro-autorefresh="true"` to call Intro.js' refresh method.
50
63
51
64
### Callbacks
52
65
53
-
Intro.js provides several callbacks. You can receive these callbacks in your controller. For example, for the `onchange` event, specify the function name in the directive.
66
+
Intro.js provides several callbacks. You can receive these callbacks in your controller. For example, for the `onchange` event, specify the function name in the directive.
54
67
55
68
`ng-intro-onchange="ChangeEvent"`
56
69
@@ -81,19 +94,19 @@ You can also use this [sample plunker](http://plnkr.co/edit/wo9EzfbOFjM7NDoAvmjA
81
94
If you want to build or contribute, first, get the node modules needed (grunt, bower)
82
95
83
96
npm install
84
-
97
+
85
98
Next, use bower to get the JS libraries needed
86
99
87
100
node_modules/.bin/bower install
88
101
89
102
Then, whenever you make any changes, get grunt to build the minified angular-intro.min.js
90
103
91
-
node_modules/.bin/grunt
104
+
node_modules/.bin/grunt
92
105
93
106
Finally, view the demo page to make sure everything's working; start a web server:
94
107
95
108
./node_modules/.bin/grunt connect:server
96
-
109
+
97
110
And browse to `http://localhost:8000/example/index.html`
98
111
99
112
@@ -102,9 +115,3 @@ And browse to `http://localhost:8000/example/index.html`
102
115
## License
103
116
104
117
As with intro.js, this is under the [MIT license](https://github.com/mendhak/angular-intro.js/blob/master/LICENSE).
0 commit comments