Last active
October 19, 2016 12:59
-
-
Save ry8806/2415d561b55cf2bccee47c0c0f5c0f63 to your computer and use it in GitHub Desktop.
Search Box Component for ASP.NET Core (MVC) and Angular2
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
/// <binding BeforeBuild='beforeBuild' /> | |
/* | |
This file in the main entry point for defining Gulp tasks and using Gulp plugins. | |
Click here to learn more. http://go.microsoft.com/fwlink/?LinkId=518007 | |
*/ | |
var gulp = require('gulp'); | |
var webRoot = "./wwwroot/"; | |
var paths = { | |
nodeModules: './node_modules/' | |
}; | |
gulp.task('default', function () { | |
// place code for your default task here | |
}); | |
gulp.task('beforeBuild', function () { | |
// Copy node_module js files across | |
gulp.src([paths.nodeModules + 'zone.js/dist/zone.js', | |
paths.nodeModules + 'reflect-metadata/Reflect.js', | |
paths.nodeModules + 'core-js/client/shim.min.js', | |
paths.nodeModules + 'systemjs/dist/system.src.js']) | |
.pipe(gulp.dest(webRoot + 'js/')); | |
// System JS Config | |
gulp.src(['./systemJS/systemjs.config.js']) | |
.pipe(gulp.dest(webRoot + 'js/')); | |
// SystemJS Needed files | |
// Angular2 | |
gulp.src([paths.nodeModules + '@angular/core/bundles/core.umd.js', | |
paths.nodeModules + '@angular/common/bundles/common.umd.js', | |
paths.nodeModules + '@angular/compiler/bundles/compiler.umd.js', | |
paths.nodeModules + '@angular/platform-browser/bundles/platform-browser.umd.js', | |
paths.nodeModules + '@angular/platform-browser-dynamic/bundles/platform-browser-dynamic.umd.js', | |
paths.nodeModules + '@angular/http/bundles/http.umd.js', | |
paths.nodeModules + '@angular/router/bundles/router.umd.js', | |
paths.nodeModules + '@angular/forms/bundles/forms.umd.js']) | |
.pipe(gulp.dest(webRoot + 'js/')); | |
// Copy across the Reactive Extensions files, in the same structure as they are found (as this needs to be preserved) | |
gulp.src([paths.nodeModules + 'rxjs/**/*.js'], { base: "node_modules/rxjs" }) | |
.pipe(gulp.dest(webRoot + 'js/')) | |
}); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
import { Component, Input, Output } from '@angular/core'; | |
@Component({ | |
selector: 'search-box', | |
template: `<div> | |
<input #box type="text" (keyup.enter)="displayAlert(box.value)" placeholder="lets get searching..." /> | |
</div>` | |
}) | |
export class SearchboxComponent { | |
constructor() { | |
} | |
displayAlert(msg: string) { | |
window.alert(msg); | |
} | |
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
/** | |
* System configuration for Angular samples | |
* Adjust as necessary for your application needs. | |
*/ | |
(function (global) { | |
System.config({ | |
// map tells the System loader where to look for things | |
// ASP.NET Core exposes the wwwroot folder without the need to specify "wwwroot" in the path | |
map: { | |
// our app is within the app folder | |
app: 'app', | |
// angular bundles Format = ('name': 'location') | |
'@angular/core': 'js/core.umd.js', | |
'@angular/common': 'js/common.umd.js', | |
'@angular/compiler': 'js/compiler.umd.js', | |
'@angular/platform-browser': 'js/platform-browser.umd.js', | |
'@angular/platform-browser-dynamic': 'js/platform-browser-dynamic.umd.js', | |
'@angular/http': 'js/http.umd.js', | |
'@angular/router': 'js/router.umd.js', | |
'@angular/forms': 'js/forms.umd.js', | |
// other libraries | |
'rxjs': 'js' | |
}, | |
// packages tells the System loader how to load when no filename and/or no extension | |
packages: { | |
app: { | |
main: './main.js', | |
defaultExtension: 'js' | |
}, | |
rxjs: { | |
defaultExtension: 'js' | |
} | |
} | |
}); | |
})(this); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Show hidden characters
{ | |
"compilerOptions": { | |
"noImplicitAny": false, | |
"module": "commonjs", | |
"moduleResolution": "node", | |
"emitDecoratorMetadata": true, | |
"experimentalDecorators": true, | |
"noEmitOnError": true, | |
"removeComments": false, | |
"sourceMap": true, | |
"target": "es5", | |
"rootDir": "app", | |
"outDir": "wwwroot/app" | |
}, | |
"exclude": [ | |
"node_modules", | |
"wwwroot" | |
], | |
"compileOnSave": true | |
} |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment