afifalfiano

# WARNING: This file is generated and it's not meant to be edited.
# Before making any changes, please read Bazel documentation.
# https://docs.bazel.build/versions/master/be/workspace.html
# The WORKSPACE file tells Bazel that this directory is a "workspace", which is like a project root.
# The content of this file specifies all the external dependencies Bazel needs to perform a build.

####################################
# ESModule imports (and TypeScript imports) can be absolute starting with the workspace name.
# The name of the workspace should match the npm package where we publish, so that these
# imports also make sense when referencing the published package.

afifalfiano

# Make TypeScript and Angular compilation fast, by keeping a few copies of the
# compiler running as daemons, and cache SourceFile AST's to reduce parse time.
build --strategy=TypeScriptCompile=worker
build --strategy=AngularTemplateCompile=worker

# Don't create bazel-* symlinks in the WORKSPACE directory, except `bazel-out`,
# which is mandatory.
# These require .gitignore and may scare users.
# Also, it's a workaround for https://github.com/bazelbuild/rules_typescript/issues/12
# which affects the common case of having `tsconfig.json` in the WORKSPACE directory.

afifalfiano

# Make TypeScript and Angular compilation fast, by keeping a few copies of the
# compiler running as daemons, and cache SourceFile AST's to reduce parse time.
build --strategy=TypeScriptCompile=worker
build --strategy=AngularTemplateCompile=worker

# Don't create bazel-* symlinks in the WORKSPACE directory, except `bazel-out`,
# which is mandatory.
# These require .gitignore and may scare users.
# Also, it's a workaround for https://github.com/bazelbuild/rules_typescript/issues/12
# which affects the common case of having `tsconfig.json` in the WORKSPACE directory.

afifalfiano

// This is a backup file of the original angular.json. This file is needed in case you want to revert to the workflow without Bazel.

{
  "$schema": "./node_modules/@angular/cli/lib/config/schema.json",
  "version": 1,
  "newProjectRoot": "projects",
  "projects": {
    "ngBazel": {
      "projectType": "application",
      "schematics": {},

afifalfiano

{
  "$schema": "./node_modules/@angular/cli/lib/config/schema.json",
  "version": 1,
  "newProjectRoot": "projects",
  "projects": {
    "ngBazel": {
      "projectType": "application",
      "schematics": {},
      "root": "",
      "sourceRoot": "src",

afifalfiano

package(default_visibility = ["//visibility:public"])

load("@build_bazel_rules_nodejs//:index.bzl", "pkg_web")
load("@npm//history-server:index.bzl", "history_server")
load("@npm//html-insert-assets:index.bzl", "html_insert_assets")
load("@npm_angular_bazel//:index.bzl", "ng_module")
load("@npm_bazel_karma//:index.bzl", "karma_web_test_suite")
load("@npm_bazel_rollup//:index.bzl", "rollup_bundle")
load("@npm_bazel_terser//:index.bzl", "terser_minified")
load("@npm_bazel_typescript//:index.bzl", "ts_devserver", "ts_library")

afifalfiano

name: Build and Deploy

on:
  push:
    branches:
    - master

jobs:
  build-and-deploy:
    runs-on: ubuntu-latest

afifalfiano

<div class="container">
<div class="row">
<div class="col-xs-12 mx-auto">
<h1 class="display-4 text-center">Reactive Form Angular</h1>
<form>
<div class="form-group">
<label for="nama">Nama</label>
<input type="text" class="form-control" id="nama">
</div>

afifalfiano

import { Component, OnInit } from '@angular/core';
import {FormControl, FormGroup, Validators} from '@angular/forms';
@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css']
})
export class AppComponent implements OnInit{
  title = 'reactiveFormAngular';
  myForm: FormGroup;

afifalfiano

<div class="container">
  <div class="row">
    <div class="col-xs-12 mx-auto">
      <h1 class="display-4 text-center">Reactive Form Angular</h1>
      <form [formGroup]="myForm" (ngSubmit)="onSubmit()">
        <div class="form-group">
          <label for="nama">Nama</label>
          <input type="text" class="form-control" id="nama" formControlName="nama">
          <span class="text-danger" *ngIf="!myForm.get('nama').valid && myForm.get('nama').touched">Nama wajib diisi!</span>
        </div>